jquery設定元素readonly與disabled屬性的方法

標籤：style   blog   http   color   io   ar   art   cti   

分享下jquery設定元素readonly與disabled屬性的方法，設定元素的顯示與隱藏，元素的唯讀屬性。

以下內容轉自：http://www.jbxue.com/article/15102.html 略作修改與補充。

Jquery的api中提供了對元素應用disabled和readonly屬性的方法：

1，設定readonly屬性

$(‘input‘).attr("readonly","readonly")//將input元素設定為readonly$(‘input‘).removeAttr("readonly");//去除input元素的readonly屬性if($(‘input‘).attr("readonly")==true)//判斷input元素是否已經設定了readonly屬性對於為元素設定readonly屬性和取消readonly屬性的方法還有如下兩種：$(‘input‘).attr("readonly",true)//將input元素設定為readonly$(‘input‘).attr("readonly",false)//去除input元素的readonly屬性$(‘input‘).attr("readonly","readonly")//將input元素設定為readonly$(‘input‘).attr("readonly","")//去除input元素的readonly屬性

2，設定disabled屬性

$(‘input‘).attr("disabled","disabled")//將input元素設定為disabled$(‘input‘).removeAttr("disabled");//去除input元素的disabled屬性if($(‘input‘).attr("disabled")==true)//判斷input元素是否已經設定了disabled屬性對於為元素設定disabled屬性和取消disabled屬性的方法還有如下兩種：$(‘input‘).attr("disabled",true)//將input元素設定為disabled$(‘input‘).attr("disabled",false)//去除input元素的disabled屬性$(‘input‘).attr("disabled","disabled")//將input元素設定為disabled$(‘input‘).attr("disabled","")//去除input元素的disabled屬性

參考連結：

• jquery設定元素readonly與disabled屬性
• jquery設定元素的readonly和disabled屬性

第二部分，jquery操作disabled屬性的三種方法。

第一種：改變disabled的boolean狀態：

$("button:eq(2)").click(function(){ var text2=$("input:text:eq(2)"); if(text2.attr("disabled")==false){ //通過設定disabled的boolean屬性將第三個text輸入框disabled屬性置為true text2.attr("disabled",true); }else{ //通過將第三個text輸入框disabled屬性置為false來移除disabled屬性 text2.attr("disabled",false); } });

 

第二種：移除disabled屬性：

$("button:eq(1)").click(function(){ var text2=$("input:text:eq(1)"); if(text2.attr("disabled")==false){ //通過設定disabled的值將第二個text輸入框置為disabled text2.attr("disabled","disabled"); }else{ //通過移除的方式將第二個text輸入框的disable屬性刪除 text2.removeAttr("disabled"); } });

 

第三種：改變disabled的值

$("button:eq(0)").click(function(){ var text1=$("input:text:eq(0)"); if(text1.attr("disabled")==""){ // 或者text1.attr("disabled")==false //通過設定disabled的值將第一個text輸入框置為disabled text1.attr("disabled","disabled"); }else{ //通過覆蓋的方式將第一個text輸入框中的disabled屬性清除掉 text1.attr("disabled",""); } });

有時間的話，再研究下jquery設定元素readonly和disabled(checkbox唯讀)的方法。