如何使用这个简单的 jQuery 禁用 HTML 文本字段？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9030093/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How can I disable the HTML textfield using this simple jQuery?
提问by awongCM
I have this simple jQuery code to test out.
我有这个简单的 jQuery 代码来测试。
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("text").attr("disabled","");
});
});
</script>
</head>
<body>
<input type="text">
<br />
<button>Set the textfield disabled</button>
</body>
</html>
Basically the HTML page comes with a simple button and textfield. All I want to have the input field disabled as I click the button. But it doesn't work???
基本上 HTML 页面带有一个简单的按钮和文本字段。我只想在单击按钮时禁用输入字段。但它不起作用？？？
(PS: this code is sourced out from w3schools.com website, just to simply test out how powerful jQuery is)
（PS：这段代码来源于w3schools.com网站，只是为了测试jQuery的强大）
回答by xdazz
From jQuery 1.7, you could use .prop:
从 jQuery 1.7 开始，您可以使用.prop：
$(document).ready(function(){
$("button").click(function(){
$(":text").prop("disabled", true);
});
});
Before 1.7, you could do:
在 1.7 之前，您可以执行以下操作：
$(document).ready(function(){
$("button").click(function(){
$(":text").attr("disabled", true);
});
});
PS: Use $(":text")or $('input[type="text"]')to select all elements of type text.
PS：使用$(":text")或$('input[type="text"]')选择文本类型的所有元素。
回答by Tapas Mahata
Try this:
尝试这个：
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("#text").attr("disabled","true");
});
});
</script>
</head>
<body>
<input id="text" type="text">
<br />
<button>Set the textfield disabled</button>
</body>
</html>
回答by gdoron is supporting Monica
There is not textselector in jquery. You need to use the attribute selector [attribute=value]
中没有text选择器jquery。您需要使用属性选择器[attribute=value]
$('input[type=text]').prop('disabled', true); // prop Works on jquery 1.7+
or:
或者：
$('input[type=text]').attr('disabled', 'disabled'); // Works in each version.
// But isn't W3C standard.
there is a :textselector but it's less efficent then the first option, see the docs:
有一个:text选择器，但它的效率低于第一个选项，请参阅文档：
$(':text')is equivalent to $('[type=text]')and thus selects all elements. As with other pseudo-class selectors (those that begin with a ":") it is recommended to precede it with a tag name or some other selector; otherwise, the universal selector ("") is implied. In other words, the bare $(':text') is equivalent to $(':text'), so $('input:text') should be used instead.
Additional Notes: Because :textis a jQuery extension and not part of the CSS specification, queries using :text cannot take advantage of the performance boost provided by the native DOM querySelectorAll() method. For better performance in modern browsers, use [type="text"]instead.
$(':text')等价于$('[type=text]')，因此选择所有元素。与其他伪类选择器（那些以“:”开头的选择器）一样，建议在它前面加上标签名或其他选择器；否则，将隐含通用选择器 (" ")。换句话说，裸 $(':text') 等价于 $(':text')，所以应该使用 $('input:text') 代替。
附加说明：因为:text是 jQuery 扩展而不是 CSS 规范的一部分，所以使用 :text 的查询无法利用原生 DOM querySelectorAll() 方法提供的性能提升。为了在现代浏览器中获得更好的性能，请改用 [type="text"]。
Note that your's XHTML isn't valid. You should close the <input type="text">=> <input type="text" />
请注意，您的 XHTML 无效。你应该关闭<input type="text">=><input type="text" />
回答by devnull69
Or (more modern):
或者（更现代）：
$("input[type=text]").prop('disabled', true);
回答by gabitzish
$("input").attr("disabled","disabled");
$("输入").attr("禁用","禁用");
回答by mpen
"disabled" is a property, not an attribute per-se. Booleans like "checked" or "disabled" don't always get updated (or retrieved) properly when accessing them that way. Use
“禁用”是一个属性，而不是属性本身。像“checked”或“disabled”这样的布尔值在以这种方式访问时并不总是正确更新（或检索）。用
$(':text').prop('disabled',true);
instead.
反而。
