原生JS开关效果的单选和组选功能

sunritz · 发表于 2018-3-11 15:23:48

提示：您可以先修改部分代码再运行

sunritz · 发表于 2018-3-12 21:00:43

增加全选

<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>原生js-checkbox-单选、组选和全选</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
</head>
<body style="font-size:62.5%">
<div class="openClose">
    <div class="check all"><input type="checkbox" value="0" /></div>
    <dl class="group">
        <dt class="check groupCheck"><input type="checkbox" value="0" /></dt>
        <dd class="check single"><input type="checkbox" value="1" /></dd>
        <dd class="check single"><input type="checkbox" value="0" /></dd>
        <dd class="check single"><input type="checkbox" value="1" /></dd>
        <dd class="check single"><input type="checkbox" value="0" /></dd>
        <dd class="check single"><input type="checkbox" value="1" /></dd>
        <dd class="check single"><input type="checkbox" value="0" /></dd>
    </dl>
    <dl class="group">
        <dt class="check groupCheck"><input type="checkbox" value="0" /></dt>
        <dd class="check single"><input type="checkbox" value="1" /></dd>
        <dd class="check single"><input type="checkbox" value="0" /></dd>
        <dd class="check single"><input type="checkbox" value="1" /></dd>
        <dd class="check single"><input type="checkbox" value="0" /></dd>
        <dd class="check single"><input type="checkbox" value="1" /></dd>
        <dd class="check single"><input type="checkbox" value="0" /></dd>
    </dl>
</div>
</body>
</html>

提示：您可以先修改部分代码再运行

帐号		自动登录	找回密码
密码			注册

[HTML5] 原生JS开关效果的单选和组选功能