jQuery动态创建的日期选择器不起作用

jQuery dynamically created datepicker not working

本文关键字：选择器 不起作用 日期 动态 创建 jQuery      更新时间：2023-09-26

我已经做了我看到的大多数解决方案，但它对我的不起作用。

这是我的代码：

function regenerateDatePickers()
{
  var length = $( ".forduplication" ).length;
  alert( length );
  for ( var i = 1 ; i <= length ; i++ ) {
    $( "#endDate" + i ).removeClass( "hasDatepicker" );
    $( "#endDate" + i ).datepicker();
  }
}

只有原始日期选取器字段有效。克隆的不是。奇怪的是，我动态创建的"选择"*字段正在工作。

*选择 http://harvesthq.github.com/chosen/

编辑 - 添加了HTML代码

<tr class="forduplication">
  <td>
    ...
    ...<!--lots of other HTML codes-->
    ...
  </td>
  <td><input id="endDate1" name="endDatefield1" size="10"></td>
  ...
</tr>

更新 06/01/15

不再支持 .live（）。使用 .on（） 可以解决这个问题。

$('body')
        .on('click', '.datePick', function() {
            $(this).datepicker();
        })
        .on('focus', '.datePick', function() {
            $(this).datepicker();
        });
<小时 />

您可以使用实时和专注

为所有输入字段提供一个类，在本例中我使用 datePick 作为类

$('input.datePick').live('focusin', function() {
    $(this).datepicker();
});​

希望这有帮助

一种方法是在每次单击时销毁并重新分配日期选择器，但它存在性能问题

$('input[id^="endDate"]').live('click', function() {
    $(this).datepicker('destroy').datepicker({showOn:'focus'}).focus();
});

它可以工作，但每次单击输入时都会删除并添加日期选择器。因此，如果您在克隆输入后可以执行此操作，那就更好了，

例如 
....clone().datepicker('destroy').datepicker({showOn:'focus'});

然后将该元素添加到所需的位置。

相关文章：