javascript - 日期选择器 JS：如何让它在多个表单字段上工作

Question

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

.js 文件包含以下代码：

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

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

我提前感谢你的努力。

Answer 1

不要使用属性，而是为您希望使用 datepicker 的元素id分配一个有意义的classeg 。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
  });
});

更新：

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

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

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

Answer 2

不要使用 ID 来识别您的输入，而是使用一个类来识别多个输入

<input id="fieldName1" class="datefield" />

$('.datefield').datepicker({
   autoclose: true
});