jquery的attr獲取表單checked 布爾值問題




<!
DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <script src="http://code.jquery.com/jquery-1.11.3.js"></script> <title>Document</title> <script type="text/javascript"> $(function(){ $('#all').on('click',function(){ $('input:lt(4)').prop('checked',true); //lt,gt是不包括臨界的, }); $('input:eq(5)').on('click',function(){ $('input:lt(4)').prop('checked',false); }); $('#btn').click(function(){ var $att=$('input:checkbox').prop('checked'); // var $att=$('input:checkbox').attr('checked' 總是彈出undefined // alert($att); if($att==false){ // $('input[checked=true]').attr('checked',false); $('input:checkbox').prop('checked',true); } else{ $('input:checkbox').prop('checked',false); } // $('[name=hobby]:checkbox').each(function(){ // this.checked=!this.checked; // //賦相反的值。 // }) }); }); </script> </head> <body> <form action=""> <label for='hobby'>你愛好的運動是</label><br> <input type="checkbox" name="hobby" >足球 <input type="checkbox" name="hobby" >籃球 <input type="checkbox" name="hobby" >羽毛球 <input type="checkbox" name="hobby" >乒乓球<br> <input type="button" value="全選" id='all'> <input type="button" value="全不選"> <input type="button" value="反選" id='btn'> <!-- <input type="button" value="提交"> --> </form> </body> </html> <!-- 問題關鍵是attr獲取不到checked的屬性值,總是彈出undefined ,后來發現要用prop來獲取值 前面的全選和反選用attr來設置checked值時候只能夠設置一次, 二用prop可以設置多次 -->

 

 

 

1.通過prop方法獲取checked屬性,獲取的checked返回值為boolean,選中為true,否則為flase
復制代碼 代碼如下:

<input type="checkbox" id="selectAll" onclick="checkAll()">全選
function checkAll()
{
var checkedOfAll=$("#selectAll").prop("checked");
alert(checkedOfAll);
$("input[name='procheck']").prop("checked", checkedOfAll);
}

2.如果使用attr方法獲取時,如果當前input中初始化未定義checked屬性,則不管當前是否選中,$("#selectAll").attr("checked")都會返回undefined;
復制代碼 代碼如下:

<input type="checkbox" id="selectAll" onclick="checkAll()" >全選

如果當前input中初始化已定義checked屬性,則不管是否選中,$("#selectAll").attr("checked")都會返回checked.
復制代碼 代碼如下:

<input type="checkbox" id="selectAll" onclick="checkAll()" checked>全選
function checkAll()
{
var checkedOfAll=$("#selectAll").attr("checked");
alert(checkedOfAll);
$("input[name='procheck']").attr("checked", checkedOfAll);
}

總結,如果使用jquery,應使用prop方法來獲取和設置checked屬性,不應使用attr. 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM