checkbox的正确判断和设置是否选中的解决 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  <script src="jquery-3.6.0.js"></script>
</head>
<body>
<div data-test="this is test" >
    <input type="button" value="全选" onclick="selectall();" />
    <input type="button" value="反选" onclick="reverseall();" />
    <input type="button" value="取消" onclick="cancelall();" />
    <table>
        <tr>
            <td>
                <input type="checkbox" checked />
            </td>
            <td>111</td>
        </tr>
        <tr>
            <td>
                <input type="checkbox"/>
            </td>
            <td>222</td>
        </tr>
        <tr>
            <td>
                <input type="checkbox"/>
            </td>
            <td>333</td>
        </tr>
         <tr>
            <td>
                <input type="checkbox"/>
            </td>
            <td>444</td>
        </tr>
    </table>
</div>
</body>
<script>
function reverseall() {
    $("input:checkbox").each(function () {
        if ($(this).is(':checked')) {
            $(this).prop("checked",false);
        } else {
            $(this).prop("checked", true);
        }
    })
}
function selectall(){
    $("input:checkbox").each(function (){
        $(this).prop("checked",true);
    })
}
function cancelall(){
    $("input:checkbox").each(function (){
        if($(this).is(':checked')){
            $(this).prop("checked",false);
        }
    })
}
</script>
</html>

 

posted @ 2021-11-07 23:29  张永谊  阅读(137)  评论(0)    收藏  举报