javascript - 日期选择器 JS : how to have it work on multiple form fields

Question

我在 WP 中使用这个插件: http://wordpress.org/plugins/cf7-datepicker-alternative/

.js 文件包含以下代码:

jQuery(document).ready(function($) {
  $('#fieldName1').datepicker({
     autoclose: true
  });
});

有谁知道如何修改这段代码，以便日期选择器可以在同一表单的多个字段中运行，例如 fieldName2 和 fieldName3 以及 fieldName1？

我提前感谢您的努力。

Answer 1

不要使用 id 属性，而是分配一个有意义的 class 例如datepicker 到你想要日期选择器的元素。然后更新您的 javascript 以使用该类选择器。

例子:

<!-- HTML -->
<input type="text" id="fieldName1" class="datepicker" />
<input type="text" id="fieldName2" class="datepicker" />

// jQuery
jQuery(document).ready(function($) {
  $('.datepicker').datepicker({
     autoclose: true
  });
});

更新:

如果您不想使用类选择器并且想使用多个 id，那么您可以执行如下操作:

<!-- HTML -->
<input type="text" id="fieldName1" />
<input type="text" id="fieldName2" />

// jQuery
jQuery(document).ready(function($) {
  $("#fieldName1, #fieldName2").each(function() {
     $(this).datepicker({
       autoclose: true
     });
  });
});