2012-03-30 105 views
0

我正在嘗試使按鈕在每次點擊時添加另一個輸入框,但我也希望它在輸入名稱的末尾添加越來越多的數字。我有這個代碼來添加更多的輸入。如何添加具有不同名稱的多個輸入框

<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"> 

+0

如果你喜歡,我可以給你一個使用jQuery的答案嗎? – 2012-03-30 09:09:53

+0

我現在想通了,謝謝。 – chris 2012-03-30 09:11:30

回答

2

您可以在表單名稱中使用[],那麼你的PHP腳本會自動這些輸入轉換爲數組,這樣,你甚至不必擔心再追加數量。

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

如果你想這樣做使用JavaScript它,最簡單的方法是有保留的投入數量的跟蹤變量

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

+0

不錯,非常感謝。 – chris 2012-03-30 09:09:57

1

andeas的答案很可能是最適合這個特定的情況。但總的來說,如果你想有一個計數器,將每次函數被調用時增加,試試:

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

counter可以就好像它是這方面的一個靜態變量來處理。

2

聲明一個計數並將其初始化爲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> 
+0

注意:你不需要逃避「如果你正在纏繞你的繩子' – 2012-03-30 09:16:31

相關問題