我正在尝试使用 JavaScript 在单击按钮的有序列表中添加文本框,并在添加文本框时增加 ID 名称
I'm trying to add textboxes within ordered list onclick of a button using JavaScript and also increment ID name while adding the textbox
我尝试使用 document.createElement,它可以很好地添加文本框,但我无法增加 ID 名称。
我在 Metro 应用程序中使用它。
function textBox(noOfInputTag){
noOfInputTag = noOfInputTag*1; // Convert to Number
//noOfInputTag is used to get total textbox you want to create
for(var i = 0; i <= noOfInputTag; i++){
var textbox = document.createElement('input');
textbox.type = 'text';`enter code here`
textbox.id = 'textBox_' + i; // As number of textbox increases id get incremented
document.body.appendChild(textbox);
}
}
textBox(2);
<form>
No. of lines:
<input type="text" id="number" value="0"/>
<br/>
<input type="button" id="button" value="Add Line" />
</form>
<div>
<ol id="linedata">
</ol>
</div>
document.getElementById('button').addEventListener("click", incrementValue);
function incrementValue() {
var value = parseInt(document.getElementById('number').value, 10);
value = isNaN(value) ? 0 : value;
value++;
document.getElementById('number').value = value;
var list = document.createElement('li');
var box = document.createElement('input');
box.type = 'text';
box.id = 'line' + value;
box.placeholder='Line ' + value;
list.appendChild(box);
document.getElementById("linedata").appendChild(list);
}
我尝试使用 document.createElement,它可以很好地添加文本框,但我无法增加 ID 名称。 我在 Metro 应用程序中使用它。
function textBox(noOfInputTag){
noOfInputTag = noOfInputTag*1; // Convert to Number
//noOfInputTag is used to get total textbox you want to create
for(var i = 0; i <= noOfInputTag; i++){
var textbox = document.createElement('input');
textbox.type = 'text';`enter code here`
textbox.id = 'textBox_' + i; // As number of textbox increases id get incremented
document.body.appendChild(textbox);
}
}
textBox(2);
<form>
No. of lines:
<input type="text" id="number" value="0"/>
<br/>
<input type="button" id="button" value="Add Line" />
</form>
<div>
<ol id="linedata">
</ol>
</div>
document.getElementById('button').addEventListener("click", incrementValue);
function incrementValue() {
var value = parseInt(document.getElementById('number').value, 10);
value = isNaN(value) ? 0 : value;
value++;
document.getElementById('number').value = value;
var list = document.createElement('li');
var box = document.createElement('input');
box.type = 'text';
box.id = 'line' + value;
box.placeholder='Line ' + value;
list.appendChild(box);
document.getElementById("linedata").appendChild(list);
}