jquery全選刪除

　　全選刪除是後臺管理中常常用到的，自身js水平弱，因此記下來，方便之後使用。

　　

html代碼：

<table>
            <thead>
            <tr>
                <td><input class="selectAll" type="checkbox"></td>
                <td>ID</td>
                <td>姓名</td>
                <td>年齡</td>
                <td>性別</td>
            </tr>
            </thead>
            <tbody id="content">
　　　　　　　 <tr>
                <td><input name="check" type="checkbox"></td>
                <td>123</td>
                <td>zhangsan</td>
                <td>24</td>
                <td>boy</td>
            </tr>
　　　　　　　　```
            </tbody>
</table> 
<button class="deleteAll">刪除所有</button>

 

js代碼：

$('.selectAll').on('click', function () {
        if(this.checked) {
            $('table input[name="check"]').prop('checked',true).val('1');
        } else {
            $('table input[name="check"]').prop('checked',false).val('0');
        }
    });
 $('.deleteAll').on('click',function () {
        if(confirm('肯定刪除這些數據嗎？')){
            var checks = $('table input[name="check"]:checked');
            if(checks.length == 0) {
                alert('未選中任何數據！');
                return false;
            }
            $('table tbody').find(':checkbox[value=1]').parents('tr').remove();
            $('.selectAll').prop('checked', false); } })  // 這裏把全選框重置爲未選狀態

這裏是經過給選中的checkbox添加value的方式，而後刪除帶有這個值的元素。固然也能夠添加其餘屬性，好比data-*什麼的。