JSP复选框全选和反选……

0 0

JSP复选框全选和反选……5

我的复选框是以循环来做的，所有每个复选框上面的NAME都是一样的，现在我要实现全选和反选该怎么做，如果按一般的方法做结果是只能选中一个复选框。。。。。
急求答案
问题补充：
谢谢各位大师回答，我需要再补充一个小问题：
   当全选的时候把所有复选框的文本值放入到一个textarea中，去复选框的value放入到一个HIDDEN中;
   再全不选的时候清空textarea和hidden的value
    不知道是我JS写得有问题还是怎样，我只能加一个值进去，而且不加值我可以实现全选跟反选，但加了赋值的语句进去后就只能选一个了

JavaScript

2009年6月24日 13:53

badgirl
17
0 0 0

4个答案按时间排序按投票排序

0 0

采纳的答案

<script language="javascript">
    function selectIt() {

        form = document.lzyy

        action = event.srcElement.name

        for (var i = 0; i < form.elements.length; i++) {

            if (form.elements[i].name == "checkbox") {

                e = form.elements[i]

                e.checked = (action == "selectAll") ? (form.selectAll.checked) : (!e.checked)
                ////在这里 通过条件表达式?:来使每个框反选。朋友们可以好好思考一下。这种首先是一种实现方式。其二 还能是代码简练。哈哈 反正个人是喜欢这种方式拉。
            }

        }

    }
</script>
<form name="lzyy">
    <p class="STYLE1">
        全 选
        <input type="checkbox" name="selectAll" value="checkbox" onClick="selectIt()">
        <br>
        反 选
        <input type="checkbox" name="invest" value="checkbox" onClick="selectIt()">
        <br>
        Item1
        <input type="checkbox" name="checkbox" value="checkbox">
        <br>
        Item2
        <input type="checkbox" name="checkbox" value="checkbox">
        <br>
        Item3
        <input type="checkbox" name="checkbox" value="checkbox">
        <br>
        Item4
        <input type="checkbox" name="checkbox" value="checkbox">
        <br>
        Item5
        <input type="checkbox" name="checkbox" value="checkbox">
    </p>
</form>

<html>
    
    <head>
        <script type="text/javascript">
            function checkEvent(name, allCheckId) {
                var allCk = document.getElementById(allCheckId);
                if (allCk.checked == true) checkAll(name);
                else checkAllNo(name);

            }

            //全选
            function checkAll(name) {
                var names = document.getElementsByName(name);
                var len = names.length;
                if (len > 0) {
                    var i = 0;
                    for (i = 0; i < len; i++)
                    names[i].checked = true;

                }
            }

            //全不选
            function checkAllNo(name) {
                var names = document.getElementsByName(name);
                var len = names.length;
                if (len > 0) {
                    var i = 0;
                    for (i = 0; i < len; i++)
                    names[i].checked = false;
                }
            }

            //反选
            function reserveCheck(name) {
                var names = document.getElementsByName(name);
                var len = names.length;
                if (len > 0) {
                    var i = 0;
                    for (i = 0; i < len; i++) {
                        if (names[i].checked) names[i].checked = false;
                        else names[i].checked = true;

                    }
                }

            }
        </script>
    </head>
    
    <body>
        <input type="checkbox" id="ckall" onclick="checkEvent('ck','ckall')" />
        全选
        <input type="checkbox" id="ckReserve" onclick="reserveCheck('ck','ckReserve')"
        />
        反选
        <br />
        <input type="checkbox" name="ck" value="1" />
        篮球
        <br />
        <input type="checkbox" name="ck" value="2" />
        旅游
        <br />
        <input type="checkbox" name="ck" value="3" />
        读书
        <br />
        <input type="checkbox" name="ck" value="4" />
        美食
        <br />
        <input type="checkbox" name="ck" value="5" />
        睡觉
    </body>

</html>

// 说明：Javascript 控制 CheckBox 的全选与取消全选
function checkAll(name) {
    var el = document.getElementsByTagName('input');
    var len = el.length;
    for (var i = 0; i < len; i++) {
        if ((el[i].type == "checkbox") && (el[i].name == name)) {
            el[i].checked = true;
        }
    }
}
function clearAll(name) {
    var el = document.getElementsByTagName('input');
    var len = el.length;
    for (var i = 0; i < len; i++) {
        if ((el[i].type == "checkbox") && (el[i].name == name)) {
            el[i].checked = false;
        }

    }

}

var checkFlag = true;　　　　
function ChooseAll() {
    if (checkFlag) {　　　　　　　　
        var inputs = document.all.tags("INPUT");　　　　　　　　
        for (var i = 0; i < inputs.length; i++) {　　　　　　　　　　
            if (inputs[i].type == "checkbox" && inputs[i].id != "CheckAll") {
                inputs[i].checked = true;　　　　　　　　　　
            }　　　　　　　　
        }
        checkFlag = false;　　　　　　
    } else {　　　　　　　　
        var inputs = document.all.tags("INPUT");　　　　　　　　
        for (var i = 0; i < inputs.length; i++) {　　　　　　　　　　
            if (inputs[i].type == "checkbox" && inputs[i].id != "CheckAll") {
                inputs[i].checked = false;　　　　　　　　　　
            }　　　　　　　　
        }
        checkFlag = true;　　　　　　
    }　　　　
}

<input type="button" name="" value="不计算长度" onclick="a()">
<input type="button" name="" value="全选" onclick="b()">
<input type="button" value="缓存" onclick="c()">
<input type="checkbox" name="test[]" value="0">
测试测试
<br>
<script language="JavaScript">
    <!--
    var ca = new Array();
    function a() {
        var m = document.getElementsByName('test[]');
        for (var i = 0; i < m.length; i++) {
            m[i].checked == true ? m[i].checked = false: m[i].checked = true;
        }
    }

    function b() {
        var m = document.getElementsByName('test[]');
        var l = m.length;
        for (var i = 0; i < l; i++) {
            m[i].checked == true ? m[i].checked = false: m[i].checked = true;
        }
    }

    function c() {
        if (ca.length == 0) {
            ca = cache();
        }
        cl = ca.length;
        for (var i = 0; i < cl; i++) {
            ca[i].checked == true ? ca[i].checked = false: ca[i].checked = true;
        }
    }

    function cache() {
        var m = document.getElementsByName('test[]');
        var cache = new Array();
        var l = m.length;
        for (var i = 0; i < l; i++) {
            cache[i] = m[i];
        }
        return cache;
    }

    //-->
    
</script>

2009年6月24日 15:13