js和jq的disabled&readonly

直接在标签上加disabled

//无论disabled的值是什么，都能禁用input元素
<input type="text" name="username" disabled="">
<input type="text" name="username" disabled=" ">
<input type="text" name="username" disabled="abc">
<input type="text" name="username" disabled>
<input type="text" name="username" disabled="true">
<input type="text" name="username" disabled="false">
<input type="text" name="username" disabled=false>
<input type="text" name="username" disabled=true>
<input type="text" name="username" disabled="disabled">
//通过removeAttribute('disabled')来移除禁用
//通过disabled=false来移除禁用
//通过disabled=''来移除禁用

js控制disabled

//无论disabled的值是什么，都能禁用input元素
var a=document.querySelector('#a');
a.setAttribute("disabled", 'false');
var b=document.querySelector('#b');
b.setAttribute("disabled", '');
var c=document.querySelector('#c');
c.setAttribute("disabled", 'true')
var d=document.querySelector('#d');
d.setAttribute("disabled", false);
var e=document.querySelector('#e');
e.setAttribute("disabled", true);
var f=document.querySelector('#f');
f.setAttribute("disabled", 'disabled');
var g=document.querySelector('#g');
g.setAttribute("disabled", 'abc');
var h=document.querySelector('#h');
h.setAttribute("disabled", ' ');
//通过removeAttribute('disabled')来移除禁用
//通过disabled=false来移除禁用
//通过disabled=''来移除禁用


//disabled为布尔值，类型转换,字符串都为true
a.disabled='false';
b.disabled="";//没有禁用
c.disabled="true";
d.disabled=false;//没有禁用
e.disabled=true;
f.disabled="disabled";
g.disabled="abc";
h.disabled=" ";

jq控制disabled

$('#a').attr('disabled','false');
$('#b').attr('disabled',false);//没有禁用
$('#c').attr('disabled','');
$('#d').attr('disabled',' ');
$('#e').attr('disabled','true');
$('#f').attr('disabled',true);
$('#g').attr('disabled','abc');
$('#h').attr('disabled','disabled');

//通过attr("disabled",false)来移除禁用
//通过removeAttr("disabled")来移除禁用

readonly，添加禁用和解除禁用的方法与disabled一样

直接在标签上加readonly,无论readonly的值是什么，都能禁用input元素。HTML不区分大小写，所以写readOnly也可以，但是不推荐。

js控制readonly：

• setAttribute(“readonly”, ‘false’);无论readonly的值是什么，都能禁用input元素。HTML不区分大小写，所以写readOnly也可以，但是不推荐。
• a.readOnly=”;当值为空字符串或者false时，没有禁用。其他值可以禁用。不能写a.readonly。

jq控制readonly：
$(‘#b’).attr(‘readonly’,false);没有禁用。其他值可以禁用。HTML不区分大小写，所以写readOnly也可以，但是不推荐。

通过removeAttribute(‘readonly’)来移除禁用.
通过readOnly=false来移除禁用.
通过readOnly=”来移除禁用.
通过attr(“readonly”,false)来移除禁用
通过removeAttr(“readonly”)来移除禁用

disabled和readonly的区别

• disabled可以用于所有表单元素，readonly只对input（text、password）和textarea有效。
• 表单元素在使用了disabled后，当我们将表单以POST或GET的方式提交的话，这个元素的值不会被传递出去，而readonly会将该值传递出去
• 如果一个输入项的disabled设为true，则该表单输入项不能获取焦点，用户的所有操作（鼠标点击和键盘输入等）对该输入项都无效。而readonly如果设为true，用户只是不能编辑对应的文本，但是仍然可以聚焦焦点和点击。