多个jquery日期时间作为表单字段不起作用


multiple jquery datetime as form field not working

当我创建只有一个"日期时间"字段的表单时:

<input type="text" id="datepicker">

可以,但当我有相同形式的乘"日期时间"字段时:

<input type="text" id="datepicker">
<input type="text" id="datepicker">

这不起作用。JQuery日期选择器仅适用于第一个输入,第二个输入不显示。什么是问题?

在我的主布局页面中,我有:

<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="{$basePath}/js/main.js"></script>

在我的main.js:中

$('#datepicker').datepicker({dateFormat: "yy-m-d"});

更改代码以使用类:

<input type="text" class="datepicker">
<input type="text" class="datepicker">

并执行您的脚本,这样:

$('.datepicker').datepicker({dateFormat: "yy-m-d"});

或者使用不同的ID:

<input type="text" id="datepicker">
<input type="text" id="datepicker2">

并执行你的脚本,所以:

$('#datepicker, #datepicker2').datepicker({dateFormat: "yy-m-d"});

不能有两个id相同的DOM元素。您可以使用类:

<input type="text" class="datepicker">
<input type="text" class="datepicker">

在main.js:中

$('.datepicker').datepicker({dateFormat: "yy-m-d"});

您根本不可能拥有相同名称的id。将它们更改为类或为您的id使用唯一的名称

您的两个输入表单字段都有相同的ID。给第二个字段一个不同的ID,比如datepicker2,然后您可以使用该ID在该字段上调用datpicker。

$('#datepicker2').datepicker({dateFormat: "yy-m-d"}); // The second datepicker

除了使用ID,您还可以使用类名:

<input type="text" class="datepicker">
<input type="text" class="datepicker">
 $('.datepicker').datepicker({dateFormat: "yy-m-d"}); // All datepickers with class "datepicker"