2013-03-22 118 views
1

我可以克隆表,但类日期选择器在克隆行中不起作用。Jquery克隆类

我不知道我是否可以使用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); 
}); 
+1

顺便说一句,住()折旧。 – dezman 2013-03-22 00:30:11

+0

.'find(':text')'这是一种新方法? – adeneo 2013-03-22 00:30:32

回答

1

在应用之前克隆需要的元素是最安全(也是更快)的。它日期选择器,(你也可以删除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/

+0

它的工作原理。非常感谢 – user1789239 2013-03-24 23:03:57

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

+0

好的,这条线工作 $ clone.find('input')。val(''); ''''。''但是不起作用。'$ clone.find('。datepicker')。datepicker({ dateFormat:'dd/mm/yy' });'不起作用。 日历始终打开第一行。 – user1789239 2013-03-22 01:17:21

+0

感谢您的帮助。 – user1789239 2013-03-24 23:04:17