如何添加一行到HTML表單？

我正在做一個簡單的應用程序，其中有一系列下拉菜單或文本框。一旦用戶填充了這些字符串，然後連接並顯示給用戶。現在我需要一個簡單的功能，用戶可以按下「+」按鈕並添加一行。理想情況下，我需要複製上面的行（包括輸入）。因此，例如，我有：如何添加一行到HTML表單？

dropdowntextboxtextboxdropdown

concatenated string

我怎麼能簡單地複製上面行（減去串聯的字符串），其中包括用戶輸入的內容。如果更簡單，現在簡單地添加上面的行將會很好。我使用JavaScript ......這裏是爲例如一種形式的代碼：

<form action=""> 
    <input type="text" id="site" value="Site" title="Site" onfocus="clickclear(this, 'Site')" onblur="clickrecall(this,'Site')" /> 
    <input type="text" id="placementdesc" value="Placement description" title="Placement description" onfocus="clickclear(this, 'Placement description')" onblur="clickrecall(this,'Placement description')" /> 
    <input type="text" id="placementtype" value="Placement Type" title="Placement Type" onfocus="clickclear(this, 'Placement Type')" onblur="clickrecall(this,'Placement Type')" /> 
    <input type="text" id="size" value="Size" title="Size" onfocus="clickclear(this, 'Size')" onblur="clickrecall(this,'Size')" /> 
    <input type="text" id="pricing" value="Pricing" title="Pricing" onfocus="clickclear(this, 'Pricing')" onblur="clickrecall(this,'Pricing')" /> 
    <select id="servetype" title="Serve Type"> 
    <option>STD – Standard trafficking type</option> 
    <option>SSV – Site-served</option> 
    <option>PIX – Pixel</option> 
    <option>CCD – Click command</option> 
    <option>PCC – Pixel and Click command</option> 
    <option>RMV – Rich Media Video</option> 
    <option>RME – Rich Media Expand</option> 
    <option>RMO – Rich Media Other</option> 
    </select> 
</form>

是這個簡單的或我需要使用DOM和使用createElement等？如果這是在桌上完成，會更容易嗎？

只是要清楚，我試圖不使用JQuery ...我願意切換，如果這樣做更容易。

來源

2011-12-22 zik

在每個輸入旁邊添加加號按鈕，並給它們一個addRow（例如）的類。

地圖的功能，.addRow click事件：

$(".addRow").click(function(){ 
    $(this) 
     .prev("input") // select the previous input element 
     .clone() // clone said element 
     .appendTo("#formID"); // append the clone to the form 
});

請記住，這將克隆的輸入現有的值，所以你可能要追加之前清除使用val()克隆的價值。

來源

2011-12-22 11:45:26 Purag

此示例代碼依賴於jQuery，因此您還應該在您的HTML頁面中包含jQuery庫。 – Sjoerd 2011-12-22 11:46:23

也就是說，假設OP使用jQuery。 – PPvG 2011-12-22 11:46:31

其實這很完美 - 我想克隆輸入的值！我假設這在JQuery中比JavaScript容易得多？ – zik 2011-12-22 11:46:55

如何添加一行到HTML表單？

回答

相關問題