为了给学习vue框架做准备入门了JavaScript

<!DOCTYPE html>
<html>

<head>

<meta charset="utf-8" />
<title>JavaScript练习</title>

<style type="text/css">

</style>

</head>

<body>

<input type="checkbox" id="All" onclick="setAllorFalse()"/>全选/全不选
<br />
<input type="checkbox" name="fact" onclick="searchAll()"/>恋恋世界第一可爱
<br />
<input type="checkbox" name="fact" onclick="searchAll()"/>恋恋世界第一可爱
<br />
<input type="checkbox" name="fact" onclick="searchAll()"/>恋恋世界第一可爱
<br />
<input type="checkbox" name="fact" onclick="searchAll()"/>恋恋世界第一可爱
<br />
<input type="checkbox" name="fact" onclick="searchAll()"/>恋恋世界第一可爱
<br />
<input type="button" value="全选" onclick="setAll()"/>
<input type="button" value="全不选" onclick="setAllFalse()"/>
<input type="button" value="反选" onclick="allSwap()"/>

<input type="submit" value="提交" onclick="submit()"/>

<script type="text/javascript">

    function setAll(){
        var facts = document.getElementsByName("fact");
        for (var i = 0; i < facts.length ; i++){
            facts[i].checked = true;
        }
        searchAll()
    }

    function setAllFalse(){
        var facts = document.getElementsByName("fact");
        for (var i = 0; i < facts.length ; i++){
            facts[i].checked = false;
        }
        searchAll()
    }

    function setAllorFalse(){
        var all = document.getElementById("All");

        if(all.checked == true){
            console.log("1");
            setAll()

        }else {
            console.log("2");
            setAllFalse()

        }
    }

    function allSwap(){
        var facts = document.getElementsByName("fact");
        for (var i = 0; i < facts.length ; i++){
            if(facts[i].checked == true){
                facts[i].checked = false ;
            }else if(facts[i].checked == false){
                facts[i].checked = true ;
            }
        }
        searchAll()
    }

    function searchAll(){
        var all = document.getElementById("All");
        var facts = document.getElementsByName("fact");
        var Allsign = 1;
        for (var i = 0; i < facts.length ; i++) {
            if(facts[i].checked == false){
                Allsign = 0;
            }
        }
        if(Allsign == 1){
            all.checked = true;
        }else{
            all.checked =false
        }
        Allsign = 1;
        var NoAllsign = 1;

    }

    function submit(){
        var facts = document.getElementsByName("fact");
        var NoAllsign = 1;
        for (var i = 0; i < facts.length ; i++) {
            if(facts[i].checked == true){
                NoAllsign = 0;
            }
        }
        if(NoAllsign == false)
        {
            alert("感谢您的坦诚");
        }else {
            alert("are you sure?");
        }

    }

</script>

</body>
</html>

Last modification:November 25th, 2020 at 01:58 pm