克隆表单字段的值

时间:2014-07-20 15:13:30

标签: javascript jquery

我正在尝试克隆表单及其各自的字段值。但是,我在所有克隆字段中获得一个字段值。

var $couriers = $('#do-list');
$('.add-do-list').click(function( e ) {

    var $cloneElem = $couriers.children('.myform').last().clone();

  $cloneElem.find('select').attr('value', $('select').val()).end()
  $cloneElem.find('input[type=text]').attr('value', $('input[type=text]').val()).end()
  $cloneElem.find('textarea').attr('value', $('textarea').val()).end()
  $cloneElem.insertAfter( $couriers.children('.myform').last() );

    e.preventDefault();
});

HTML:

<ul id="do-list">
<li class="myform">
<form>
<input type="text" name="fname" value="to be clone" />
<input type="text" name="lname" value="to be clone" />
<textarea name="detail">to be clone</textarea>
</form>
<div class="add-do-list">Duplicate form</div>
</li>
</ul>

1 个答案:

答案 0 :(得分:0)

第一行,您在,之后有$('#do-list')。需要使用分号或;

在第一个.find之前,您需要$cloneElem才能找到它。

试试这个:

var $couriers = $('#do-list');
$('.add-do-list').click(function( e ) {

    var $cloneElem = $couriers.children('.myform').last().clone();

  $cloneElem.closest('select').attr('value', $('select').val()).end()
  .closest('input[type=text]').attr('value', $('input[type=text]').val()).end()
  .closest('textarea').attr('value', $('textarea').val()).end()
  .insertAfter( $couriers.children('.myform').last() );

    e.preventDefault();
});

<强>更新

.find()

替换.closest()

<强> JSFiddle Demo