複数の入力ボックスを異なる名前で追加する方法

Question

クリックするたびに別の入力ボックスを追加するボタンを作成しようとしていますが、入力名の末尾に増加する数字を追加したいとします。私はこのコードを使って、より多くの入力を追加します。

<script type="text/javascript"> 
function addInput() 
{ 
    var x = document.getElementById("inputs"); 
    x.innerHTML += "<input type=\"file\" name=\"photo\" />"; 
} 
</script> 

私は毎回、新しいフォームが追加された私が正しく私のPHPスクリプトで画像を処理することができるように、それは名前=「写真」の終わりに高い番号を追加するようにそれを作るために何ができますか？

<input type="file" name="photo"> 

が、私は写真の最後に新しい入力は、このような出力を持つように作られるたびに番号を追加したいと思います：

デフォルトはフォームがあります。

<input type="file" name="photo"> 
<input type="file" name="photo2"> 
<input type="file" name="photo3"> 
<input type="file" name="photo4"> 

など

Answer 1

あなたは、あなたのPHPスクリプトは、自動的にあなたももう数字を追加心配する必要はありませんそのように、配列にそれらの入力に変換されます、フォーム名で[]を使用することができます。

<input type="file" name="photo[]"> 

JavaScriptを使用してそれを実行したい場合は、最も簡単な方法はandeasの答えは、おそらく、この特定のために最善である入力

var inputNumber = 0; 
function addInput() 
{ 
    var x = document.getElementById("inputs"); 
    x.innerHTML += "<input type=\"file\" name=\"photo\"" + inputNumber + " />"; 
    inputNumber++; 
} 

Answer 2

の数を追跡する変数を持つことです状況。しかし、あなたは関数が呼び出されるたびに増加しますカウンタをしたい場合は、一般的には、試してみてください。それは、この文脈では、静的変数であるかのように

(function { 
    var counter = 0; 
    window.myfunction = function() { 
     // do stuff, use counter if needed 
     counter++; 
    } 
})(); 

counterを治療することができます。

Answer 3

カウントを宣言し、0に初期化してから、すべての呼び出しで値を大きくします。

<script type="text/javascript"> 
var count=0; 
function addInput() 
{ 
    var x = document.getElementById("inputs"); 
    x.innerHTML += '<input type=\"file\" name=\"photo\"'+count+' />; 
    count++; 
} 
</script>