2016-05-15 80 views
1

程序显示的表格中有作为默认文本的输入。请我想知道如何将其替换为具有ID的输入文本框。谢谢如何在javascript中创建输入文本框

<html> 
<body> 

</body> 
<script> 
function tableCreate(){ 
var body = document.body, 
tbl = document.createElement('table'); 
tbl.style.width = '100px'; 
tbl.style.border = '2px solid black'; 
var n=5 
for(var i = 0; i < n; i++){ 
    var tr = tbl.insertRow() 
    var td = tr.insertCell(0); 
    var tf = tr.insertCell(0); 
    td.appendChild(document.createTextNode('input')); 
    tf.appendChild(document.createTextNode('input')); 
    td.style.border = '2px solid black'; 
    tf.style.border = '2px solid black'; 
    } 

body.appendChild(tbl); 
} 
tableCreate(); 
</script> 
</html> 

回答

1

替代document.createElement("input")document.createTextNode("input");创建一个form元素,在创建的每个input元素处包含name属性属性;设置id"input-a" + i"input-b" + i;附加input type="submit"form元素;创建追加到table元素form

<body> 
 
    <script> 
 
    function tableCreate() { 
 
     var body = document.body, 
 
     tbl = document.createElement('table'); 
 
     tbl.style.width = '100px'; 
 
     tbl.style.border = '2px solid black'; 
 
     var n = 5 
 
     for (var i = 0; i < n; i++) { 
 
     var tr = tbl.insertRow(); var td = tr.insertCell(0); 
 
     var tf = tr.insertCell(0); 
 
     var input = document.createElement('input'); 
 
     input.name = "input-a" + i; 
 
     input.id = "input-a" + i; 
 
     input.value = ""; 
 
     var clone = input.cloneNode(); 
 
     clone.name = "input-b" + i; 
 
     clone.id = "input-b" + i; 
 
     td.appendChild(clone); 
 
     tf.appendChild(input); 
 
     td.style.border = '2px solid black'; 
 
     tf.style.border = '2px solid black'; 
 
     } 
 
     var form = document.createElement("form"); 
 
     form.appendChild(tbl); 
 
     body.appendChild(form); 
 
     var submit = document.createElement("input"); 
 
     submit.type = "submit"; 
 
     form.appendChild(submit) 
 
    } 
 
    tableCreate(); 
 
    </script> 
 
</body >

+0

非常感谢,它的工作。但是,我希望输入元素拥有id,因此我可以提取这些值,以及如何创建一个将一次提交所有输入框的提交按钮。谢谢你的帮助 – chika

+0

@chika查看更新后的帖子 – guest271314

+0

非常感谢。我很感激 – chika

相关问题