jQuery-克隆日期选择器字段

jQuery - Cloning a datepicker field

本文关键字:选择器 字段 日期 jQuery-      更新时间:2024-02-26

我正试图克隆一个表行,并让一个日期选择器框处理所有行。目前,第一个是有效的,但不是后来的盒子。

有人能提供一些建议吗?非常感谢您的帮助!

这是代码:

HTML

<link rel="stylesheet" type="text/css" href="http://brenda.upreach.org.uk/plugins/jquery.datepick.package-4.1.0/redmond.datepick.css"> 
    <script type="text/javascript" src="http://brenda.upreach.org.uk/plugins/jquery.datepick.package-4.1.0/jquery.datepick.js">  </script>
    <div class="clone_Associate">
<input type="text" name="DATE_SET[]" class="datepick" value="04/12/2013">
    </div>
    <div class="placer_Associate"></div>
        <a href="#" class="clone_trigger_Associate">Clone a new datebox!</a>

jQuery

$(function() {
    $('.datepick').datepick({ 
            dateFormat: 'dd/mm/yyyy', showTrigger: '#calImg'});
});

$(document).ready(function(){
          $(".clone_trigger_Associate").click(function () {
              var total = $('[name^="UPDATE_METHOD"]').length;
              var index = Math.round(total / 2);
              $('.clone_Associate').last().clone().insertBefore(".placer_Associate");
              $('input.cl:last').val('');
              $('.clone_Associate').last().find("input[type='checkbox']").prop("name","UPDATE_METHOD["+index+"][]")
              // Date pick element
              $('.datepick').datepick({ 
                    dateFormat: 'dd/mm/yyyy', showTrigger: '#calImg'}
              );
              event.preventDefault();  
            });
        });

一个jsfiddle在这里:http://jsfiddle.net/dalepotter/aSG6e/

演示:http://jsfiddle.net/aSG6e/15/

$(function() {
 var options = {dateFormat: 'dd/mm/yy'}
 $('.datepick').datepicker(options);
 $(".clone_trigger_Associate").click(function (e) {
    e.preventDefault();
    var $newInput = $('.datepick:last').clone(true).removeAttr('id');
    $(this).before($newInput);
    $newInput.datepicker('destroy').datepicker(options);
 });
});

更改此代码;

$('.clone_Associate').last().clone().insertBefore(".placer_Associate");

与此相关;

var newDate = '<div class="clone_Associate"><input type="text" name="DATE_SET[]" class="datepick" value="04/12/2013"></div>';
$('.clone_Associate:last').after(newDate);