jQuery全选和js全选

最新推荐文章于 2023-05-25 08:32:18 发布

wsy157

最新推荐文章于 2023-05-25 08:32:18 发布

阅读量300

点赞数 1

CC 4.0 BY-SA版权

分类专栏： jQuery 文章标签： jquery全选和js全选

本文链接：https://blog.youkuaiyun.com/wsy157/article/details/83054377

jQuery 专栏收录该内容

2 篇文章

订阅专栏

jQuery全选和js全选

jQuery全选

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>jquery</title>
<script src="js/jquery.1.9.1.js" type="text/javascript"></script>
<script>
$(function(){
    isChecked=false;
    $("#checkboxs").click(function(){
        isChecked=!isChecked;
        if(isChecked){
            $('.checkbox').prop('checked', true);
        }else{
            $('.checkbox').removeProp('checked');
        }
    })
})；
</script>
</head>
<body>
        <input type="checkbox" id="checkboxs">全选<br>
        <input class="checkbox" type="checkbox" ><br>
        <input class="checkbox" type="checkbox"><br>
        <input class="checkbox" type="checkbox"><br>
        <input class="checkbox" type="checkbox"><br>
        <input class="checkbox" type="checkbox"><br>
</body>
</html>

js全选

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>js全选</title>
<script>
function checkboxs(){
    var all=document.getElementById('checkboxs');
    var check=document.getElementsByClassName('checkbox');
    for(var i=0;i<check.length;i++){
        check[i].checked= all.checked;
    }
}
</script>
</head>
<body>
        <input type="checkbox" id="checkboxs" onclick="checkboxs()">全选<br>
        <input class="checkbox" type="checkbox"><br>
        <input class="checkbox" type="checkbox"><br>
        <input class="checkbox" type="checkbox"><br>
        <input class="checkbox" type="checkbox"><br>
        <input class="checkbox" type="checkbox"><br>    
</body>
</html>