нажмите на кнопку создать текстовое поле

Question

это глупый вопрос, но по какой-то причине я не могу понять это или найти простой пример где-либо.все, что я хочу, это кнопка, которая при нажатии создает текстовое поле с тем же именем + 1.

<input type="button" value="Show" onclick="blah" />
<!-- Button Gets Clicked -->
<input type="text" name="added1" /> 
<!-- Button Gets Clicked -->
<input type="text" name="added2" />
<!-- Button Gets Clicked -->
<input type="text" name="added3" />

возможно javascript !?есть идеи?

Answer 1

Встроенный javascript - не лучший способ приблизиться к этому, но ...

<input type="button" value="Show" onclick="var e = document.createElement('input'); e.type='text'; e.name = 'added'+this.rel; this.rel = parseFloat(this.rel)+1; this.parentNode.appendChild(e); return false;" />

Лучше отделить вашу презентацию от сценария:

HTML:

<input type="button" value="Show" id="add_btn" />

Кросс-браузерный Javascript:

var handler_func = function () {
    var i = (typeof this.rel != 'undefined') && (this.rel - 0) == this.rel ? this.rel : 0;
    var e = document.createElement('input');
    e.type='text';
    e.name = 'added'+i;
    this.rel = i+1;
    this.parentNode.appendChild(e);
    return false;       
}

var add_btn = document.getElementById('add_btn');
if(add_btn.attachEvent)
      add_btn.attachEvent('onClick', handler_func);
else if(add_btn.addEventListener) //Firefox & company
      add_btn.addEventListener('click', handler_func, false);

Скрипка: http://jsfiddle.net/rkYpD/1/