JavaScript：現在のdivに入力要素を追加

Question

私は、ページに3つの入力を持つdivと同じdivに入力を追加するためのリンクを追加するjavascript関数を持っています。動的に追加することができます）。

var div=document.createElement("div"); 
div.innerHTML='<input type="text" name="question" /><br><br>'+ 
       '<input type="text" name="input1"/><br />'+ 
       '<input type="text" name="input2"/><br />'+ 
       '<a href="javascript:addInput()">Add input field</a>'; 

var parent_div=document.getElementById('dinamicni_div'); 
parent_div.appendChild(div); 

どのように私は今（現在INPUT2）（ただし、上記のリンク）と同じdiv要素内の最後の入力以下の入力を追加するには、このaddInput（）関数を実装するだろうか？

私はコンテンツを動的に生成する2つのJS関数を持っています：addDiv（）。これは上記のように短縮されています。私が実装したいと思うaddInput（）とリンクがクリックされた現在のdivに1つの入力を追加する必要があります。

Answer 1

あなたが作成したdivの中に入力フィールドを含むdivを追加すると、以前と同じように子を追加して新しい要素を簡単に追加できます。

Answer 2

あなたのリンククラスやIDを与えると、このメソッドを使用して挿入します。http://api.jquery.com/insertBefore/

編集：

私は同意し、彼の要件は、それを可能にするであろうことを、質問はjqueryのではないでした、まだアスカーが示唆、および完全性のために、ここでのjQueryのコードは（学習のjqueryのポスター不当な脅迫を取ること）である

function createInputMethod(){ 
    return $('<input type="text" name="question" /><br><br>'+ 
       '<input type="text" name="input1"/><br />'+ 
       '<input type="text" name="input2"/><br />'); 
} 

var div = $("<div/>"); 
div.append(createInputMethod()); 
div.append($('<a href="javascript:addInput()" id="btn">Add input field</a>'); 
var parent_div=$('dinamicni_div'); 
div.appendTo(parent_div); 

function addInput(){ 
    createInputMethod().insertBefore("#btn"); 
} 

Answer 3

をお試しください

document.getElementById('yourdiveID').innerHTML += "<input type='text' value='' /><br />"; 

divの最後に追加されます。

Answer 4

私はこのようなことをします。すべての入力を取得します。入力数をカウントし、jquery afterメソッドを使用して追加します。

function addInputMethod() { 

    var len = $('div').find('input').length; 


    $('input:nth-child(' + len + ')').after('<input type="text" name="input' + (len + 1) +'"/><br />'); 
} 

EDIT

あなたはまた、第2ラインを変更するには、この

var len = $(this).parent().find('input').length;

に長さを変更することができますdivためidをお持ちでない場合は、次のコードは次のようなものです

$(this).parent().find('input:nth-child...