使用jQuery禁用/启用input?
$input.disabled = true;
要么
$input.disabled = "disabled";
标准的方式是什么? 而且,相反,如何启用禁用的input?
jQuery 1.6+
要更改disabled
属性,您应该使用.prop()
函数。
$("input").prop('disabled', true); $("input").prop('disabled', false);
jQuery 1.5及以下
.prop()
函数不存在,但.attr()
做类似的:
设置禁用的属性。
$("input").attr('disabled','disabled');
要再次启用,正确的方法是使用.removeAttr()
$("input").removeAttr('disabled');
在任何版本的jQuery中
如果你只处理一个元素,你总是可以依靠实际的DOM对象,并且可能比其他两个选项快一点:
// assuming an event handler thus 'this' this.disabled = true;
使用.prop()
或.attr()
方法的优点是可以为一堆选定的项目设置属性。
注意:在1.6中有一个.removeProp()
方法,听起来很像removeAttr()
,但它不应该用于像'disabled'
这样'disabled'
本地属性上'disabled'
摘自文档:
注意:请勿使用此方法删除本机属性,如选中,禁用或选中。 这将完全删除该属性,一旦删除,不能再添加到元素。 使用.prop()将这些属性设置为false。
实际上,我怀疑这个方法有很多合理的用法,布尔型的道具是这样做的,你应该把它们设置为false,而不是像在1.5中的“属性”对应那样“去除”它们
只是为了新的惯例和使它适应前进(除非事情发生巨大的ECMA6变化(????):
$(document).on('event_name', '#your_id', function() { $(this).removeAttr('disabled'); });
和
$(document).off('event_name', '#your_id', function() { $(this).attr('disabled','disabled'); });
// Disable #x $( "#x" ).prop( "disabled", true ); // Enable #x $( "#x" ).prop( "disabled", false );
有时你需要禁用/启用表单元素,如input或textarea。 jquery可以帮助你轻松做到这一点,设置禁用的属性为“禁用”。 例如:
//To disable $('.someElement').attr('disabled', 'disabled');
要启用禁用的元素,您需要从此元素中删除“禁用”属性或清空它的string。 例如:
//To enable $('.someElement').removeAttr('disabled'); // OR you can set attr to "" $('.someElement').attr('disabled', '');
请参考: http : //garmoncheg.blogspot.fr/2011/07/how-to-disableenable-element-with.html
$("input")[0].disabled = true;
要么
$("input")[0].disabled = false;
你可以把它放在代码中的某个地方:
$.prototype.enable = function () { $.each(this, function (index, el) { $(el).removeAttr('disabled'); }); } $.prototype.disable = function () { $.each(this, function (index, el) { $(el).attr('disabled', 'disabled'); }); }
然后你可以写这样的东西:
$(".myInputs").enable(); $("#otherInput").disable();
如果您只想反转当前状态(如切换button行为):
$("input").prop('disabled', ! $("input").prop('disabled') );
<html> <body> Name: <input type="text" id="myText"> <button onclick="disable()">Disable Text field</button> <button onclick="enable()">Enable Text field</button> <script> function disable() { document.getElementById("myText").disabled = true; } function enable() { document.getElementById("myText").disabled = false; } </script> </body> </html>
在JQuery的移动。
对于禁用
$('#someselectElement').selectmenu().selectmenu('disable').selectmenu('refresh', true); $('#someTextElement').textinput().textinput('disable');
启用
$('#someselectElement').selectmenu().selectmenu('enable').selectmenu('refresh', true); $('#someTextElement').textinput('enable');