萬盛學電腦網 >> 腳本專題 >> javascript >> jquery改變disabled的boolean狀態的三種方法
jquery改變disabled的boolean狀態的三種方法
改變disabled的boolean狀態，下面為大家介紹三種比較不錯的方法，大家可以參考下
第一種：改變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",""); } }); 完整的示例代碼如下（已測試通過)： 代碼如下: 代碼如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <script src="jquery的路徑引入就行了"></script> <script type="text/javascript"><!-- $(document).ready(function () { $("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", ""); } }); $("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"); } }); $("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); } }); }); // --></script> </head> <body> <button>disabledNull</button> <input type="text" value="input something into me!" size="40"/> <br/> <button>disabledRemove</button> <input type="text" value="input something into me!" size="40"/> <br/> <button>disabledState</button> <input type="text" value="input something into me!" size="40"/> </body> </html>javascript排行
程序編程推薦
相關文章
copyright © 萬盛學電腦網 all rights reserved