Question

我有这个HTML代码：

        <c:forEach items="${config.sources}" var="source" varStatus="sourceStatus">
            <form:checkbox path="sources[${sourceStatus.index}].selected" 
            label="${source.sourceName}" 
            name="${sourceStatus.index}"
            onclick="toggle(this)"/>
            <br />
            <c:forEach items="${source.feeds}" var="feed" varStatus="status">
                <c:if test="${feed.display == true }">  
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    <form:checkbox path="sources[${sourceStatus.index}].feeds[${status.index}].selected" name="${sourceStatus.index}"/>
                    <c:out value="${feed.name}" /> (provided by ${feed.provider})
                <br />
                </c:if>
            </c:forEach>
        </c:forEach>

它的作用是制作一堆复选框，如果选中“main”复选框，则调用javascript方法“toggle”，该方法应选择“main”复选框的所有“sub”复选框。这是javascript：

<script type="text/javascript">
    function toggle(chkbox) {

    if (chkbox.checked) {
            var x = document.getElementsByName(chkbox.name);
            for ( var i in x) {
                if (!x[i].checked)
                    x[i].click();
                alert("HEY!" + x[i].name);
            }
        } else if (!chkbox.checked) {
            var x = document.getElementsByName(chkbox.name);
            for ( var i in x) {
                if (x[i].checked)
                    x[i].click();
                alert("HEY!" + x[i].name);
            }
        }
    }
</script>

然而，当选中“main”复选框时，不会检查其“子”框。此外，当选择“主”后警报响起时，只有一个警报响起，大概是“主”框，并且它不打印出预期的索引，而是说，“来源[X] .selected“其中X是索引。此外，取消选择时，无论“子”框的数量如何，它都有四个警报。他们总是分别说“source [X] .selected”，“undefined”，“item”和“namedItem”。 WTH正在进行??！我一定是做错了。

Answer 1

一些事情：

无需测试“chkbox.checked”和“！chkbox.checked”;它是一个布尔值，所以如果它不是真的，那就是假的。
不要使用“for ... in”循环。那些应该是
```
for (var i = 0; i < x.length; ++i)
```

要选中复选框，您应该使用

    x[i].checked = true;
    x[i].checked = false; // to make it un-checked

Answer 2

好的，对我来说问题是jsp几乎保留了所有可设置的变量。因此，不能使用name，id或类似的东西来识别复选框。我最终做的是：

JSP：

        <input type="checkbox" value="false"
            label="Select/Deselect All" title="-1"
            onclick="toggle(this, '-1')" />
        <br />
        <c:forEach items="${config.sources}" var="source"
            varStatus="sourceStatus">
            <form:checkbox path="sources[${sourceStatus.index}].selected"
                label="${source.sourceName}" title="${sourceStatus.index}"
                onclick="toggle(this, ${sourceStatus.index})" />
            <br />
            <c:forEach items="${source.feeds}" var="feed" varStatus="status">
                <c:if test="${feed.display == true }">  
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    <form:checkbox
                        path="sources[${sourceStatus.index}].feeds[${status.index}].selected"
                        title="${sourceStatus.index}" />
                    <c:out value="${feed.name}" /> (provided by ${feed.provider})
                <br />
                </c:if>
            </c:forEach>
        </c:forEach>

使用Javascript：

function toggle(chkbox, title) {
    var y = document.getElementsByTagName("input");
    var xIndex = 0;
    var x = new Array();
    for (var i = 0; i < y.length; ++i) {
        if((y[i] != null) && (y[i].title == title || title == -1)){
            x[xIndex] = y[i];
            xIndex++;
        }
    }
if (chkbox.checked) {
        for (var i = 0; i < x.length; ++i) {
            x[i].checked = true;
        }
    } else {
        for (var i = 0; i < x.length; ++i) {
            x[i].checked = false;
        }
    } 
}

标题是jsp没有使用的唯一可编辑字段我能找到。很遗憾，我知道，但是很好。

HTML名称不匹配

2 个答案: