Question

我可以克隆表，但类datepicker在克隆行中不起作用。

我不知道我是否可以使用find来获取它。

<table width="100%" border="0" cellspacing="0" cellpadding="0" >
<tr>
    <td>Name</td>
    <td>Location</td>
    <td>From</td>
    <td>To</td>
    <td>Add</td>
</tr>
<tr class="tr_clone">
    <td><input type="text" autofocus placeholder="who" name="who" ></td>
    <td><input type="text" autofocus placeholder="location" name="location" ></td>
    <td><input type="text" placeholder="Start Date" name="datepicker_start" class="datepicker"></td>
    <td><input type="text" placeholder="End Date" name="datepicker_end" class="datepicker"></td>
    <td><input type="button" name="add" value="New" class="tr_clone_add"></td>
</tr>

$(".datepicker").datepicker({
    dateFormat: 'dd/mm/yy'
});


$("input.tr_clone_add").live('click', function() {
var $tr    = $(this).closest('.tr_clone');
var $clone = $tr.clone();
$clone.find(':text').val('');
$clone.find('datepicker_start').addClass("datepicker");    
$tr.after($clone); 
});

Answer 1

当您克隆小部件时，属性不会被复制，我也不认为有一个名为:text的选择器，请尝试

$("input.tr_clone_add").live('click', function() {
    var $tr    = $(this).closest('.tr_clone');
    var $clone = $tr.clone(true, true);
    $clone.find('input').val('');
    $clone.find('.datepicker').datepicker({
        dateFormat: 'dd/mm/yy'
    });    
    $tr.after($clone); 
});

演示：Fiddle

Answer 2

在对其应用datepicker之前克隆所需元素是最安全（也更快），（您还可以删除类hasDatepicker）：

var $to_clone = $('.tr_clone').first().clone();
$(".datepicker").datepicker({
    dateFormat: 'dd/mm/yy'
});


$("table").on('click', 'input.tr_clone_add', function () {
    var $tr    = $(this).closest('.tr_clone');
    var $clone = $to_clone.clone();
    $clone.find(':text').val('');
    $tr.after($clone);
    $clone.find('.datepicker').datepicker({
        dateFormat: 'dd/mm/yy'
    });
});

http://jsfiddle.net/oceog/yWpBm/

Jquery克隆与类

2 个答案: