Question

我有两个日期选择器来选择开始日期和结束日期。当我选择日期从第一个工作正常但是当我从第二个日期选择器选择日期时它会覆盖第一个选择的日期。我的代码是：

<script type="text/javascript" src="datetimepicker_css.js" /></script>
<table align="left" class="tbl_altcolor shadow" style="width:35%; margin-left:20px">
<tbody>
<tr>
     <td>Date-From:</td>
      <td>
         <input type="Text" id="demo3" class="input required" maxlength="20" size="15" name="time3">
         <img src="images2/date.png" align="center" width="20" height="20" border="0" onclick="javascript:NewCssCal('demo3','yyyyMMdd')" style="cursor:pointer"/>
        <span class="descriptions"></span>
        </td>

         <td>Date-To:</td>
      <td>
         <input type="Text" id="demo2" class="input required" maxlength="20" size="15" name="time5">
         <img src="images2/date.png" align="center" width="20" height="20" border="0" onclick="javascript:NewCssCal('demo3','yyyyMMdd')" style="cursor:pointer"/>
        <span class="descriptions"></span>
        </td>
</tr>

如何解决这个问题？

Answer 1

点击图片后，您的代码就会触发：

javascript:NewCssCal('demo3','yyyyMMdd')

它会触发标识为demo3的输入日历，而您在示例中提供的元素的标识为demo2：

<input type="Text" id="demo2" class="input required" maxlength="20" size="15" name="time5">

因此，请确保您的元素具有正确的ID，并在触发点击时正确引用。

HTML 代码应为：

<table align="left" class="tbl_altcolor shadow" style="width:35%; margin-left:20px">
    <tbody>
        <tr>
            <td>Date-From:</td>
            <td>
                <input type="Text" id="demo2" class="input required" maxlength="20" size="15" name="time3">
                <img src="http://www.rainforestnet.com/datetimepicker/images2/cal.gif" align="center" width="20" height="20" border="0" onclick="javascript:NewCssCal('demo2','yyyyMMdd')" style="cursor:pointer" />    <span class="descriptions"></span>

            </td>
        </tr>
        <tr>
            <td>Date-To:</td>
            <td>
                <input type="Text" id="demo3" class="input required" maxlength="20" size="15" name="time5">
                <img src="http://www.rainforestnet.com/datetimepicker/images2/cal.gif" align="center" width="20" height="20" border="0" onclick="javascript:NewCssCal('demo3','yyyyMMdd')" style="cursor:pointer" />    <span class="descriptions"></span>

            </td>
        </tr>
    </tbody>
</table>

Here is the JSFiddle demo

日期选择器采用相同的日期值

1 个答案: