鍍金池/ 問答/HTML5  Java  Python  HTML/ 關(guān)于checkbox多選框的一些問題

關(guān)于checkbox多選框的一些問題

1.為啥我全選和取消只能生效一次,無法循環(huán)使用?
2.為啥我的反選判斷失效???
3.代碼如下:
HTML:

  <form action="#" method="post" id="fomOne">
        你愛好的運動是?
        <br>
        <br>
        <input type="checkbox" name="items" id="checkedAll" value="籃球"> 籃球
        <input type="checkbox" name="items" id="" value="足球"> 足球
        <input type="checkbox" name="items" id="" value="乒乓球"> 乒乓球
        <input type="checkbox" name="items" id="" value="羽毛球"> 羽毛球
        <br>
        <br>
        <input type="button" value="全選" id="checkAll">
        <input type="button" value="全不選" id="checkNo">
        <input type="button" value="反選" id="checkRev">
        <input type="submit" value="提交" id="sub">
    </form>

JS代碼:

    //復(fù)選框應(yīng)用:
    $('#checkAll').click(function () {
        $('input:checkbox').attr('checked',true);
    })
    $('#checkNo').click(function () {
        $('input:checkbox').attr('checked',false);
    })
    $('#checkRev').on('click',function () {

        if($('input:checkbox').is('checked',true)){

            $('input:checkbox').attr('checked',false)

        }else{

            $('input:checkbox').attr('checked',true)

        }

    })
回答
編輯回答
不將就

具有 true 和 false 兩個屬性的屬性,如 checked, selected 或者 disabled 使用prop(),其他的使用 attr()

補(bǔ)充一下,其實你用attr也可以,但是取消勾選的時候要用removeAttr('checked')

2017年10月11日 21:43
編輯回答
影魅

jquery的用法不對.去看下 attr的文檔吧
http://www.css88.com/jqapi-1....

把a(bǔ)ttr換成 prop就可以了
順手幫你改了代碼

$('#checkAll').click(function() {
  $('input:checkbox').prop('checked', true);
})
$('#checkNo').click(function() {
  $('input:checkbox').prop('checked', false);
})
$('#checkRev').on('click', function() {
  $('input:checkbox').each(function(ind) {
    $(this).prop('checked', !$(this).prop('checked'))
  })
})
2017年2月10日 18:33