Как создатьдинамично

Question

Я хочу динамически создавать текст ввода в моей веб-форме.Более конкретно, у меня есть текстовое поле, в которое пользователь вводит количество нужных текстовых полей;Я хочу, чтобы текстовые поля создавались динамически в одной форме.

Как мне это сделать?

Answer 1

С JavaScript:

var input = document.createElement("input");
input.type = "text";
input.className = "css-class-name"; // set the CSS class
container.appendChild(input); // put it into the DOM

Answer 2

Используя Javascript, все, что вам нужно, это document.createElement и setAttribute.

var input = document.createElement("input");
input.setAttribute('type', 'text');

Затем вы можете использовать appendChild, чтобы добавить созданный элемент к нужному родительскому элементу.

var parent = document.getElementById("parentDiv");
parent.appendChild(input);

Answer 3

Возможно, метод document.createElement(); - это то, что вы ищете.

Answer 4

См. Этот ответ для решения не JQuery. Просто выручил меня!

Добавление элементов ввода динамически для формирования

Answer 5

Я думаю, что следующая ссылка поможет вам.Если вы хотите генерировать поля динамически, а также хотите удалить их одновременно, вы можете получить помощь здесь.У меня был тот же вопрос, и я получил ответ

Answer 6

Вы можете использовать createElement() метод для создания этого текстового поля

Answer 7

Вы можете сделать что-то подобное в цикле на основе количества текстовых полей, которые они вводят.

$('<input/>').attr({type:'text',name:'text'+i}).appendTo('#myform');

Но для повышения производительности я сначала создал бы все html и вставил бы их только в DOMодин раз.

var count = 20;
var html = [];
while(count--) {
  html.push("<input type='text' name='name", count, "'>");
}
$('#myform').append(html.join(''));

Редактировать В этом примере для добавления HTML-кода используется jQuery, но вы также можете легко изменить его, чтобы использовать innerHTML.