javascript - 仅在 "activated"输入字段上显示日期选择器

Question

我尝试使用 jquery-ui 的 datepicker() 函数创建两个日期输入字段，bot 字段的 id 为“datepicker”:<input type="text id="datepicker" name="publishUp">和<input type="text id="datepicker" name="publishDown">

我尝试将一个功能附加到事件焦点，如下所示，希望仅在“已激活”字段上显示日历，但它不起作用。我想知道哪里出了问题？

<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
     <script>
        $("#datepicker").focus(function() {
        $(this).datepicker();
        });
    </script>

Answer 1

仅在激活输入字段时显示是日期选择器的默认行为。将日期选择器从事件处理程序中取出。

您不应该有多个具有相同 ID 的输入； $("#datepicker") 选择器只会找到第一个。如果您想要多个日期选择器输入，请改用类。所以 HTML 应该是:

<input type="text" class="datepicker" name="publishUp">
<input type="text" class="datepicker" name="publishDown">

然后 jQuery 应该是:

$(function() {
    $(".datepicker").datepicker({
        // options
    });
});