Javascript html名称不'；不匹配

我有以下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>

（由${feed.provider}提供）

它所做的是创建一组复选框，如果选中“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>

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;
        }
    } 
}

功能切换（chkbox）{
如果（chkbox.checked）{
var x=document.getElementsByName（chkbox.name）；
对于（x中的变量i）{
如果（！x[i].已选中）
x[i]。单击（）；
警报（“嘿！”+x[i].name）；
}
}否则，如果（！chkbox.checked）{
var x=document.getElementsByName（chkbox.name）；
对于（x中的变量i）{
如果（x[i]。选中）
x[i]。单击（）；
警报（“嘿！”+x[i].name）；
}
}
}

但是，虽然选中了“main”复选框，但没有选中其“sub”复选框。此外，当警报在选择“main”后熄灭时，只有一个警报熄灭，可能是针对“main”框，并且它不会像预期那样打印索引，而是显示“sources[X].selected”，其中X是索引。此外，取消选择时，无论“子”框的数量如何，它都有四个警报。他们总是分别说“sources[X].selected”、“undefined”、“item”和“namedItem”。这是怎么回事？？！我一定是做错了什么事。

有几件事：

不需要同时测试“chkbox.checked”和“！chkbox.checked”；这是一个布尔值，所以如果它不是真的，它就是假的

不要使用“for…in”循环。这些应该是

for (var i = 0; i < x.length; ++i)

有几件事：

不需要同时测试“chkbox.checked”和“！chkbox.checked”；这是一个布尔值，所以如果它不是真的，它就是假的

不要使用“for…in”循环。这些应该是

for (var i = 0; i < x.length; ++i)

---

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

JSP:

（由${feed.provider}提供）

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>

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;
        }
    } 
}

功能切换（chkbox，标题）{
var y=document.getElementsByTagName（“输入”）；
var xIndex=0；
var x=新数组（）；
对于（变量i=0；i

---

Title是我能找到的jsp未使用的唯一可编辑字段。悲哀，我知道，但哦，好吧。

好吧，所以我的问题是jsp保留了几乎所有可设置的变量。因此，不能使用名称、id或类似的东西来标识复选框。我最后做的是：

JSP:

（由${feed.provider}提供）

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>

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;
        }
    } 
}

功能切换（chkbox，标题）{
var y=document.getElementsByTagName（“输入”）；
var xIndex=0；
var x=新数组（）；
对于（变量i=0；i

---

Title是我能找到的jsp未使用的唯一可编辑字段。悲伤，我知道，但是很好。

所以如果你的问题措辞得当，你表现出努力，并且有人知道这个问题，那么答案很快。在问题标题和正文中添加快速回答请求会产生负面影响，因此我投了反对票。另外，这不是HTMLYou是对的，我读了你的评论并打算删除快速回答请求，但Brandon抢先一步。这是jsp，但由于jsp转换为html，所以它是html。我的意思是，这些名称实际上是html。也许不是，也许这是我的问题。我想如果你向我们展示一些生成的HTML，你会得到一个更快的答案，因为老实说jsp掩盖了我的想法。我也不确定你想要达到什么效果。JSFIDLE链接如何？因此，如果你的问题措辞得当，你表现出努力，并且有人了解这个问题，那么答案很快。在问题标题和正文中添加快速回答请求会产生负面影响，因此我投了反对票。另外，这不是HTMLYou是对的，我读了你的评论并打算删除快速回答请求，但Brandon抢先一步。这是jsp，但由于jsp转换为html，所以它是html。我的意思是，这些名称实际上是html。也许不是，也许这是我的问题。我想如果你向我们展示一些生成的HTML，你会得到一个更快的答案，因为老实说jsp掩盖了我的想法。我也不确定你想要达到什么效果。JSFIDLE链接怎么样？