！小弟我遇到了一个很诡异的有关问题，各位路过的大神帮忙看看-JavaSript-爱易网页

！小弟我遇到了一个很诡异的有关问题，各位路过的大神帮忙看看

日期：2014-05-16　浏览次数：20511 次

求助！我遇到了一个很诡异的问题，各位路过的大神帮忙看看
代码如下，很简单的几行代码：

HTML code


<html>
   <script type="text/javascript">
     function processor(){
         var echkbox = null;  
         var addhere=document.getElementById("div");  
         echkbox=document.createElement("input");  
         echkbox.setAttribute("type","checkbox");  
         echkbox.setAttribute("id","checkbox");  
         echkbox.setAttribute("value","蔬菜");  
         echkbox.onclick = addValue;  
         addhere.appendChild(echkbox);
         addhere.appendChild(document.createTextNode("蔬菜"));
     }
     
     function addValue(){
         var value = "";
         var len = document.all.checkbox.length;
         //显示当前checkbox的个数
         window.alert(len)
         for(var i=0;i<len;i++){
              if(document.all.checkbox[i].checked == true){
                  value = value + document.all.checkbox[i].value +",";
              }
         }
         //给text文本框赋值
         document.getElementById("text").value = value;
     }
   </script>
  
  <body>
    <center>
    
            种类：<input type="text" id="text" />
        <div id="div" >

        </div>
        <input type="button" value="增加" onclick="processor();">
    </center>
  </body>
</html>

这段代码的目的，是增加一个checkbox，然后选中checkbox，此时在文本框中能显示选中的checkbox的内容。现在遇到的情况时这样的，当只增加一个checkbox时，即使选中这个checkbox的内容，在文本框中也不能显示内容，而且打印此时checkbox的个数为“undefined”，如下图所示：

但是，诡异的情况发生了，当增加的checkbox的个数为两个或者两个以上时，此时如果选中任何一个checkbox的内容，在文本框中都能显示其内容，而且打印checkbox的个数也是正常的。比如增加两个时，截图如下：

请各位大神帮忙看看问题出在哪个地方，小弟感激不尽

------解决方案--------------------
<html>
<script type="text/javascript">
function processor(){
var echkbox = null;
var addhere=document.getElementById("div");
echkbox=document.createElement("input");
echkbox.setAttribute("type","checkbox");
echkbox.setAttribute("id","checkbox");
echkbox.setAttribute("value","蔬菜");
echkbox.onclick = addValue;
addhere.appendChild(echkbox);
addhere.appendChild(document.createTextNode("蔬菜"));
}
function addValue(){
var value = "";
var len = document.getElementById("div").getElementsByTagName("input").length; //显示当前checkbox的个数
window.alert(len);
for(var i=0;i<len;i++){
if(document.getElementById("div").getElementsByTagName("input")[i].checked == true){
value = value + document.getElementById("div").getElementsByTagName("input")[i].value +",";
}
}
document.getElementById("text").value = value;
}
</script>
<body>
<center> 种类：<input type="text" id="text" />
<div id="div" > </div>
<input type="button" value="增加" onclick="processor();">
</center>
</body>
</html>
这样试试
------解决方案--------------------

HTML code


<html>
   <script type="text/javascript">
     function processor(){
         var echkbox = null;  
         var addhere=document.getElementById("div");

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

！小弟我遇到了一个很诡异的有关问题，各位路过的大神帮忙看看

相关资料更多>

推荐阅读更多>