Добрый день, подскажите пожалуйста как лучше сделать ссылку, которая будет находится где то возле формы, при нажатии на которую, будет добавлятся новый инпут в форму.

<style>
input{
    margin:3px;
    display:block;
}
</style>
<form>
    <span id="inputs"> 
    <input type="text" name="text[]"/>
    </span>
    <br/>
    <a onclick="addInput()" href="#">Добавить input</a>
    <br/>
    <input type="submit"/>
</form>    

<script>
    function addInput(){
        var parent = document.getElementById('inputs');
        var input = document.createElement("input");
            input.type = 'text';
            input.name = "text[]";    

        parent.appendChild(input);
    
        return false;
    }
</script>    

http://jsfiddle.net/dm3e8e4n/

_____________
HTML, CSS (Bootstrap), JS(JQuery, ExtJS), PHP, MySQL, MSSql, Posgres, (TSql, BI OLAP, MDX), Mongo, Git, SVN, CodeIgnater, Symfony, Yii 2, JiRA, Redmine, Bitbucket, Composer, Rabbit MQ, Amazon (SQS, S3, Transcribe), Docker

Игорь_Vasinsky
Спасибо, я просто в js не совсем рублю, если у меня есть такая форма:

<form action="<?php echo $url;?>" method="post">
<input type="text" name="word" placeholder="Enter word" value="<?php echo $options['word'];?>"><br>
<input type="text" name="link" placeholder="Enter URL" value="<?php echo $options['link'];?>"><br>
<input type="submit" value="save">
</form>
То мне надо добавить в форму

<a onclick="addInput()" href="#">Добавить input</a>?

И я так понимаю, что еще нужен span, но можно ли как то обойтись без него, а то думаю на работе меня за этот спан не похвалят?)
Тоесть впринципе мне надо, что бы он по нажатию добавлял два новых инпута которые есть в форме, а именно <input name="word"> и <input name="link">

span использован как родитель, он не включает в себя submit
чтобы инпуты стояли до submit

_____________
HTML, CSS (Bootstrap), JS(JQuery, ExtJS), PHP, MySQL, MSSql, Posgres, (TSql, BI OLAP, MDX), Mongo, Git, SVN, CodeIgnater, Symfony, Yii 2, JiRA, Redmine, Bitbucket, Composer, Rabbit MQ, Amazon (SQS, S3, Transcribe), Docker

Игорь_Vasinsky
Поэтому родителю мы просто находим input?

//это родитель        
var parent = document.getElementById('inputs');
//создали инпут        
var input = document.createElement("input");
input.type = 'text';
input.name = "text[]";    
//добавили в родителя инпут
parent.appendChild(input);
//запрет перехода по ссылке
return false;

_____________
HTML, CSS (Bootstrap), JS(JQuery, ExtJS), PHP, MySQL, MSSql, Posgres, (TSql, BI OLAP, MDX), Mongo, Git, SVN, CodeIgnater, Symfony, Yii 2, JiRA, Redmine, Bitbucket, Composer, Rabbit MQ, Amazon (SQS, S3, Transcribe), Docker

Соответсвенно если надо добавить два инпута, то надо повторить то же действие?

var parent = document.getElementById('inputs');
var input = document.createElement('input');
input.type = 'text';
input.name = 'word';

parent.appendChild(input);

var parent = document.getElementById('inputs');
var input = document.createElement('input');
input.type = 'text';
input.name = 'link';

parent.appendChild(input);

return false;


//запрет перехода по ссылке
return false;
Не совсем понял этот момент, по какой ссылке?)

чтобы 2 интупа на 1 клик. Нужно добавить ещё 1 функцию
http://jsfiddle.net/dm3e8e4n/2/

Kusss
Принцип ясен, спасибо:)