克隆/添加新表格字段

Question

<div class="input url required addnew" id="ConfigurationValues"> 
    <label>Bigblue</label> 
    <input name="data[Configuration][value][]" value="cool" type="text"> 
    <input name="data[Configuration][value][]" value="awesome" type="text"> 
    <input name="data[Configuration][value][]" value="neat" type="text"> 
    <div class="actions" style="padding-left:0px;"> 
    <a onclick="return FALSE;" href="#" id="AddNew">Add</a> 
    </div>           
</div> 

我想複製/克隆輸入。我有下面的代碼適用於文本。

$('a.AddNew').click(function(){ 
    var pool = $(this).closest('.addnew'); 
    pool.find('input[type=text]:first').clone().val('').insertAfter(pool.find("input[type=text]:last")); 
    return false 
}) 

現在我想寫一個廣義的代碼照顧type = url，email，tel，number和select標籤。

在上面的代碼行3-6將改變folows

<input name="data[Configuration][value][]" value="neat" type="url"> 

或

<input name="data[Configuration][value][]" value="neat" type="tel"> 

或

<select></select> 

Answer 1

你的意思是這樣的：

function cloneElement(selector) { 
    $('a.AddNew').click(function(){ 
    var pool = $(this).closest('.addnew'); 
    var inputs = pool.find(selector); 
    inputs.first().clone().val('').insertAfter(inputs.last()); 
    return false; 
    }); 
} 

function cloneInput(type) { 
    return cloneElement('input[type=' + type + ']'); 
} 

function cloneSelect() { 
    return cloneElement('select'); 
} 

編輯：好的，那麼：

$('a.AddNew').click(function(){ 
    var pool = $(this).closest('.addnew'); 
    var inputs = pool.find("input, select"); 
    inputs.first().clone().val('').insertAfter(inputs.last()); 
    return false; 
    });