如何實現「全選」複選框並在HTML中顯示div的值？

Question

$(function() { 
    //it is use for selectall and if any not checked so selectall is unchecked 
    var checkall = $('#checkall'); 
    var boxes = $('input[type="checkbox"]').not(checkall); 

    checkall.click(function() { 
     boxes.attr('checked', this.checked); 
    }); 
    boxes.change(function() { 
     checkall[0].checked = this.checked && boxes.filter(':checked').length === boxes.length; 
    }); 

    //this is for show the value of selected checkbox in the div id+"checked" 
    $('input:checkbox').click(function() { 

     var $checked = $('#checked'); 
     $checked.html(''); 

     $('input:checkbox').each(function (index) { 
      if ($(this).is(':checked')) { 
       $checked.append('<div>' + $('label[for="' + $(this).attr('id') + '"]').text() + '</div>'); 
      } 
     }); 
    }); 
}); 

Answer 1

你從來沒有確切地說過你的問題是什麼，但是這個代碼應該是你要找的。注意jQuery的.prop（）代替.attr（）

$(document).ready(function() { 
    //it is use for selectall and if any not checked so selectall is unchecked 
    var checkall = $('#checkall'); 
    var boxes = $('input[type="checkbox"]').not(checkall); 

    checkall.click(function() { 
    var checked = $(this).is(':checked'); 
    boxes.prop('checked', checked); 
    }); 

    boxes.change(function() { 
    checkall[0].checked = this.checked && boxes.filter(':checked').length === boxes.length; 
    }); 

    //this is for show the value of selected checkbox in the div id+"checked" 
    $('input:checkbox').click(function() { 

    var $checked = $('#checked'); 
    $checked.html(''); 

    $('input:checkbox').each(function (index) { 
     if ($(this).is(':checked')) { 
      $checked.append('<div>' + $(this).attr('id') + '</div>'); 
     } 
    }); 
    }); 
});