动态控制按钮的onclick事件

动态控制按钮的onclick事件

我想实现的效果是：

1.根据复选框的值来判断按钮是全喜欢或者全不喜欢。

2.根据按钮的value来控制复选框的全选或全不选

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <style type="text/css">
        #Checkbox1
        {
            width: 20px;
        }
    </style>
</head>
<script>
    function a() {
        var a = document.getElementsByName("ic");
        for (var i = 0; i < a.length; i++) {
            a[i].checked = true;
        }
        b();
    }
    function b() {
        var a = document.getElementsByName("ic");
        var b = 0;
        for (var i = 0; i < a.length; i++) {
            if (a[i].checked == true) {
                b++;
            }
        }
                if (b == 4) {
                    document.getElementById("Button1").onclick = function () { d(); };
                    document.getElementById("Button1").value = "全不喜欢";
                }
                else {
                document.getElementById("Button1").onclick = function () { a(); };
                document.getElementById("Button1").value = "全喜欢";
                }
    }

    function d() {
        var a = document.getElementsByName("ic");
        for (var i = 0; i < a.length; i++) {
            a[i].checked = false;
        }
        document.getElementById("Button1").onclick = function () { a(); };
        document.getElementById("Button1").value = "全喜欢";
    }
</script>
<body>

    <p>
        你喜欢那种类型咖啡</p>
    <p>
        <input name="ic" id="Checkbox1" type="checkbox" onclick="b()" />蓝山咖啡</p>
    <p>
        <input name="ic" id="Checkbox2" type="checkbox" onclick="b()" />摩卡</p>
    <p>
        <input name="ic" id="Checkbox3" type="checkbox" onclick="b()" />拿铁</p>
    <p>
        <input name="ic" id="Checkbox4" type="checkbox" onclick="b()" />卡布奇诺</p>
    <p>
        <input name="io" id="Button1" type="button" value="全喜欢" onclick="a()"/></p>
</body>
</html>

第七科灬水高

浏览 1309回答 3

3回答

慕的地8582982

YOBEJQPMZTELXUOFGWDVDGXNDWBBHADWAVYBUVOYNABOWZWZCMTWFMJSOOZPZSPEVVAJMKADDZPGWQGFQSGWVIKKAASNQTHHDJJNJMTCCCCLIMUQAHNYOLQANLCBWKPRHGILFDMFUZVFPYDFUFZFYWQGVFBRYWLLWWCCIYOIJXOUPLCZJSSCFZPTTWQAUKSNTDWCJPOYLLXJZCSQGYUNFMWTNMPJDJJUKDXBDBPJFMPYYQWMJFLMXDEYORKERTPTCGDZGZPEOBSLVGGWIXDUQNGGGMPPCJTPMCGVEUKGDCRCLBEAJMVYKGWFHDZJEBKHJGDNXBDGQBXTQNJHDGILVDFPLOYUDZCYEGQNDOKAVXUXWUVLISFGMWXTXACZVFPSHXNXGDGVTIMACQILIRVYAQNGCGILILUEGDCRUDLVQACAJURHXGQTWSITOQNXFCFBQOMJSBRADAKZPZVKFUXUXGVTPFNXSORGXGDTIXOLHEMJMIZJEIEHDFCEBXPEOWMBROXHQWSVLCSJFBECUEBEMVLHDURTCSTJUJTCFORORHYULUDNWVJZWFVLUKNDGCZPGWGCYJAOEMQZCAKGWTFULVMPYIRBRPQGILCYBKNKZCSVSOQHQUDPSWZCSORZCZBJZPSORUPNDTIRTWTWLHLCTPZBJSVLADUCKBXHEHKMPTZOFHRUDMVMWZBXHQAEVXUEEGDYBKURURGTPZPYVYUQBXDZBZIYBETWMTCFIEGPFBLIMILMJSBLVEVXFPZOSVYHXUZCMJMKUIXCSKXISUENKZJSADMWAZJFPORGWMWFWZPRUDSVSILVLBDYPVXCLUQAJYIYFNYIRFIKTDABQBXIROYHEURUQTXNXHWZXZCZUSISCEHW

0

0

慕田峪3555374

<html> <script language=javascript> function selectAll(){ var a = document.getElementsByTagName("input"); if(a[0].checked){ for(var i = 0;i<a.length;i++){ if(a[i].type == "checkbox") a[i].checked = false; } } else{ for(var i = 0;i<a.length;i++){ if(a[i].type == "checkbox") a[i].checked = true; } } } </script> <input type="checkbox" value=1 /> <input type="checkbox" value=2 /> <input type="checkbox" value=3 /> <input type="checkbox" value=4 /> <input type="checkbox" value=5 /> <input type="button" name="select" onclick="selectAll()" value="全选/全不选"/> </html>

0

0

慕田峪3555374

获取所有复选框，过滤判断状态及数量

0

0

随时随地看视频慕课网APP

相关问题

为什么字体颜色在Eclipse上没有变化 2 回答

相关分类

Html/CSS: 为什么字体颜色在Eclipse上没有变化 2 回答
JavaScript