Question

我有以下功能将普通文本字段转换为日期选择器：

<input type="text" class="datepicker form-control" name="text-150" >

var DatePicker = function () {

   if ($(".datepicker").length === 0) {
       return;
   }

   $(".datepicker").pikaday({
      firstDay: 1,
      format: "D MMM YYYY"
   });
 };

当文本字段使用datepicker类进行硬编码时，上述工作正常。但是如果我有文本字段并在页面通过某个事件加载后动态注入datepicker类，那么如何将datepicker插件绑定到文本字段？

Answer 1

这是你想要实现的目标吗？

$( function() {
    $('button').click(function() {
    $('body').append('<input type="text" class="datepicker" name="text-150" >');
    var cl = $('input').attr('class');
    $( "." + cl ).datepicker();
  })
});

Answer 2

试试这个。它会对你有所帮助。

var id=1;
$('#addDate').on('click',function(){
  $("#dates").append('Date '+id+' : <input type="text" id="datepicker'+id+'"><br/>');
  $("#datepicker"+id).datepicker();
  id++;
});
$('#removeAll').on('click',function(){
	$("#dates").html('');
  id=1;
});

<link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet"/>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<button type="button" id="addDate">Add Date</button>
<button type="button" id="removeAll">Remove All</button>
<div id="dates"></div>

快乐编码......

jQuery - 使用动态类将插件绑定到文本框？

2 个答案: