克隆/添加-新表单域

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、电子邮件、电话、号码和选择标签。

在上面的代码中，第3-6行将按如下方式更改

<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');
}

编辑: Ok，关于以下内容：

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