【问题标题】:Jquery Select All / Deselect CheckBoxesJquery全选/取消选择复选框
【发布时间】:2017-07-24 00:26:02
【问题描述】:

我目前有这个显示记录列表,下面有几个按钮。其中两个被称为针对复选框的“全选”和“全部清除”。我想知道如何实现代码来选择所有存在的复选框并取消选择它们,有点像切换但在两个单独的按钮上。

function showAll(qstring,qtype){
 $("#vsdiv").show();
 var myurl="scripts/searchadmin.php"; 
 $.ajax({
  url: myurl, dataType:'json',data:{querystring:qstring,querytype:qtype},
  success: function(member){
   $("#resultstable").append('<tr class="yellow">'+
                                        '<th>#REC</th><th>JOINED</th><th>USER NAME</th>'+
                                        '<th>CONTACT</th><th>ADDRESS</th><th>PHONE</th>'+
                                        '<th>EMAIL</th><th>STATUS</th><th>SELECT</th></tr>');
   var j=0;var totrecs=1;
   for(var i=0;i<10;i++){
    $("#resultstable").append('<tr class="trow'+j+'">'+
                  '<td class="ids" id="z'+i+'">'+totrecs+'</td>'+
          '<td>'+member[i].jdate+'</td>'+
          '<td class="users"     id="username'+i+'">'+member[i].username+'</td>'+
          '<td id="contact'+i+'">'+member[i].fname+' '+member[i].lname+'</td>'+
          '<td id="myaddress'+i+'">'+member[i].address1+' '+member[i].town+'</td>'+
          '<td id="phone'+i+'">'+member[i].phone+'</td>'+
          '<td id="email'+i+'">'+member[i].email+'</td>'+
          '<td id="status'+i+'">'+member[i].status+'</td>'+
          '<td><input type="checkbox" name="whome" id="showMe'+i+'"'+
                                         'class="boxes" onclick="getMe('+i+')" /></td></tr>');  
                                         $('#sr').html('Showing 1 of '+member.length+' Members')

});


  totrecs++;
  j++;
 }
}
});
}

非常感谢任何关于我应该采取的方法的想法。

【问题讨论】:

    标签: jquery checkbox html-table


    【解决方案1】:
    $(function () {
    $('#selectall').click(
        function() {
            $('.boxes').prop('checked', true);
        }
    );
    });
    
    $(function () {
    $('#clearall').click(
        function() {
            $('.boxes').prop('checked', false);
            }
         );
    });
    

    【讨论】:

      【解决方案2】:
      $(document).ready(function () {
        $('#selectall').click(function() {
           $('.boxes').attr('checked','checked');
        });
        $('#clearall').click(function() {
          $('.boxes').removeAttr('checked');
        });
      });
      

      DEMO

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2016-02-20
        • 1970-01-01
        • 2015-05-08
        • 1970-01-01
        • 1970-01-01
        • 2014-06-29
        • 2013-09-29
        相关资源
        最近更新 更多