2016-05-15 5 views
1

В таблице, отображаемой программой, есть вход в качестве текста по умолчанию внутри. Пожалуйста, я хочу знать, как заменить его текстовым полем ввода с идентификатором. СпасибоКак создать текстовое поле ввода в 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

Substitute document.createElement("input") для document.createTextNode("input"); создайте элемент form, включите атрибут атрибута name на каждый созданный элемент input; комплект id - "input-a" + i и "input-b" + i; append input type="submit" до form элемент; Append создан 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, поэтому dt я могу извлечь значения, а также как создать кнопку отправки, которая будет сразу отправлять все поля ввода. Спасибо, что помогли – chika

+0

@chika Посмотреть последнее сообщение – guest271314

+0

Спасибо большое. Я ценю – chika

Смежные вопросы