在这段代码中,我试图根据select字段的输入生成动态文本字段,该字段由addInput(divname)函数使用on change事件处理,但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>
答案 0 :(得分:1)
var k=parseInt(document.getElementById("branches"))
你不能解析一个DOM元素。
怀疑你的意思
var k=parseInt(document.getElementById("branches").value,10)
感谢Shikiryu的评论:明确指定基数。
答案 1 :(得分:0)
更改行
var k=parseInt(document.getElementById("branches"));
到
var k=parseInt(document.getElementById("branches").value);
答案 2 :(得分:0)
document.getElementById("branches")
返回一个DOM-Node,但您需要做的是获取此DOM-Node的值。因此,请尝试以下操作生成k
。
var k=parseInt(document.getElementById("branches").value);
答案 3 :(得分:0)
据我所知,parseInt(document.getElementById("branches"));
将导致NaN
。您试图将整个DOM节点解析为整数,您期望什么?您可能希望从中获取value
property:
parseInt(document.getElementById("branches").value, 10);
答案 4 :(得分:0)
我想你忘记将.value添加到document.getElementById(“branches”)
答案 5 :(得分: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>