CRUD(31):删除-全选和全不选

一、添加一个checkbox

<th><input type="checkbox" id="check_all" /></th>

var checkBoxTd = $("<td><input type='checkbox' class='check-item'/></td>");

                           //append方法执行完成以后还是返回原来的元素

                           $("<tr></tr>").append(checkBoxTd).append(empIdTd).append(empNameTd).append(

                                        genderTd).append(emailTd).append(deptNameTd).append(

                                        btnTd).appendTo("#emps_table tbody");


二、全选和全不选

             //删除-全选/全不选

             $("#check_all").click(function(){

                    //attr获取checked是undefined

                    //attr获取自定义属性的值

                    //prop修改和读取原生属性的值

                    $(this).prop("checked");

                    $(".check_item").prop("checked",$(this).prop("checked"));

             });

             

             //全选等于5个的时候勾选全选框

             $(document).on("click",".check_item",function(){

                    //判断当前选中的元素是不是5个

                    var 
flag=$(".check_item:checked").length==$(".check_item").length;

                    $("#check_all").prop("checked",flag);

             });

posted on 2021-02-16 00:31  northwest  阅读(38)  评论(0)    收藏  举报

导航