在飛行中添加輸入jquery

我想知道如果我可以得到一些幫助與jQuery。這是HTML我現在有：在飛行中添加輸入jquery

<form name="input"> 
<input id="current" type="text" name="content" placeholder="content"> 
<input type="submit" value="Add" id="add"> 
</form>

我想要做的就是當用戶點擊「添加」，只要輸入字段心不是空洞的，我要做到以下幾點：

更改該輸入字段ID爲「接受」，並刪除添加按鈕旁邊，並用刪除按鈕
取代它添加下面原來的輸入域ID爲「當前」與添加按鈕旁邊

我想這個過程中發生的每一個添加按鈕被點擊左右的時間越來越多的輸入框可以在對方產卵。據我得到的是試圖產卵輸入框，但即使這不起作用。

function addField(){ 
$('#add').append('<input type="text" name="myinput" />'); 
return false; 
}

任何人都可以請告訴我應該如何實現。

來源

2013-06-19 James Willson

要附加到錯誤的元素，如果你嘗試將ID改爲接受每個輸入類型的輸入不能包含其他元素 – George

，你將面對問題.Ids應該是唯一的 –

您需要追加到表單中，而不是初始者的提交按鈕 – BLSully

我想每次克隆現有元素都不是一個好的解決方案。相反，我會建議克隆...以及克隆））原始input和button保持不變，只是在視覺上移位。

此行爲是否需要？ - http://jsfiddle.net/skip405/9sX6X/6/

來源

2013-06-19 11:54:03 skip405

使用before()

$('#add').before('<input type="text" name="myinput" />');

，因爲你只需要之前追加新的輸入您的提交按鈕（不進去，在這裏是不可能的，因爲它是一個輸入元素）

來源

2013-06-19 11:38:56 fcalderan

我無法獲得該代碼的工作方式:(http://jsfiddle.net/spadez/9sX6X/11/ –

您'不要調用'addField'函數，現在當你點擊按鈕時，你只是發送表單：試試這個：http://jsfiddle.net/MnAGZ/1/ – fcalderan

工作示例http://jsfiddle.net/steelywing/9sX6X/12/

$('form').on('click', '.add', function() { 
    var row = $(this).closest('div'), 
     new_row = row.clone(); 

    row.find('input:text').addClass('accepted'); 

    row.find('.add') 
     .removeClass('add') 
     .addClass('remove') 
     .val('Remove'); 

    new_row.find('input:text').val(''); 

    row.after(new_row); 
}).on('click', '.remove', function() { 
    $(this).closest('div').remove(); 
});

來源

2013-06-19 11:56:42

我建議刪除'id's因爲它們被克隆在你的版本 – skip405

@ skip405更新=） –

在飛行中添加輸入jquery

回答

相關問題