1

在这段代码中,我试图根据 addInput(divname) 函数使用 on change 事件处理的 select 字段的输入生成动态文本字段,但是 addInput 函数中的 while 循环不起作用,当我删除 while 循环时它的工作。我必须生成选定的编号。文本字段......当我选择不同的数字时,文本字段也应该改变......

<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    </head>
    <body>
        <form action="adduniv.php" method="post">
            University Name: <input type="text" name="college">
            No. of branches:
            <div id="dynamicInput">
                 <select name="branches" id="branches" onchange="if (this.selectedIndex) addInput('dynamicInput');;" ">
                     <option value="1">1</option>
                     <option value="2">2</option>
                     <option value="3">3</option>
                     <option value="4">4</option>
                     <option value="5">5</option>
                     <option value="6">6</option>
                     <option value="7">7</option>
                     <option value="8">8</option>
                </select>
            </div>   
            <script>
                var counter = 0;
                var limit = 3;  
                function addInput(divName)
                {       
                    var k=parseInt(document.getElementById("branches"));
                    var newdiv;
                    while(k>0) 
                    {
                        newdiv = document.createElement('div');
                        newdiv.innerHTML = "Entry " + (counter + 1) + " <br><input type='text' name='myInputs[]'>";
                        document.getElementById(divName).appendChild(newdiv);
                        counter++;
                        k--;
                     }
                 }
             </script>
             <input type="submit" value="submit" />
         </form>
    </body>
</html>
4

6 回答 6

1
var k=parseInt(document.getElementById("branches"))

你不能 parseInt 一个 DOM 元素。

怀疑你的意思

var k=parseInt(document.getElementById("branches").value,10)

感谢 Shikiryu re 的评论:明确指定基数。

于 2013-04-09T14:05:09.063 回答
0

换行

var k=parseInt(document.getElementById("branches"));

var k=parseInt(document.getElementById("branches").value);
于 2013-04-09T14:05:54.377 回答
0

document.getElementById("branches")返回一个 DOM-Node,但是你需要做的是获取这个 DOM-Node 的值。所以尝试以下生成k.

var k=parseInt(document.getElementById("branches").value);
于 2013-04-09T14:06:04.770 回答
0
parseInt(document.getElementById("branches"));

NaN据我所知,将导致。您试图将整个 DOM 节点解析为整数,您期望什么?您可能希望从中获取value属性

parseInt(document.getElementById("branches").value, 10);
于 2013-04-09T14:06:24.160 回答
0

我认为您忘记将 .value 添加到 document.getElementById("branches")

于 2013-04-09T14:07:34.157 回答
0

好的,我知道问题已解决,但我会尝试这样做:

    <!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">    
    <title>Creating input fields</title>
    <script>
      function addInput(nr_branches) {
        var nCounter = 0;        
        //-- Cleaning all elements
        var divB = document.getElementById('divBranches');
        if(divB.hasChildNodes()) {
          while(divB.childNodes.length >= 1) {
            divB.removeChild(divB.firstChild);
          }
        }                
        while(nCounter < nr_branches) {          
          //-- Create a input field
          var input = document.createElement("input");
          input.type = 'text';
          input.name = 'branche_nr_' + nCounter;
          input.placeholder = 'Branche Nr.' + nCounter;
          //document.getElementById("divBranches").innerHTML = "<input type='text' name='branche_nr_'"+ nCounter +" placeholder='Branche Nr."+ nCounter +"' />";
          document.getElementById('divBranches').appendChild(input);        
          nCounter++;          
        }                 
      }    
    </script>
  </head>  
  <body>
    <form name="frm" action="adduniv.php" method="post">
      <input type="text" name="college" placeholder="University Name" />
      <select name="branches" id="branches" onchange="addInput(this.value)">
        <option value="0">-select your branche-</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
        <option value="6">6</option>
        <option value="7">7</option>
        <option value="8">8</option>
      </select>
      <div id="divBranches"></div>
      <input type="submit" value="submit" />      
    </form>
  </body>
</html>
于 2013-04-09T17:38:33.617 回答