Datepicker给出了div和输入标记

Question

我已成功将日期选择器附加到输入字段。但是，是否可以在单击span字段后显示附加到输入的日期选择器？

<div class="date_month">
<input class="date" id = "set_date_01" type="text" readonly> 
<span class="date_icon">&nbsp;</span></div>

我环顾四周，找不到一个好的解决方案。任何帮助表示赞赏！

Answer 1

我会试试这个：

$('.date_icon').on('click', function() {
    $('#set_date_01').focus();
});

但是你真的应该使用label for属性而不是你的范围。你不会需要js来达到这个效果，这对于可访问性来说非常好。

例如：

<div class="date_month">
<label for="set_date_01">
    Pick a date
    <input class="date" id="set_date_01" type="text" readonly>
</label>
</div>

Answer 2

DatePicker有一个名为buttonImage的属性：

$(".date").datepicker({
    buttonImage: "/images/datepicker.gif",
    showOn: "both"
});

showOn必须设置为button或both才能生效。

Answer 3

如果不知道您正在使用哪个日期选择器，确实很难说，但大多数jQuery日期选择器都会有可以手动触发的事件。因此，您需要捕获该span标记的click事件，并触发datepicker＆＃39;显示datepicker＆＃39;事件

这里有一些文档描述了我在使用jQuery UI内置的datepicker时的意思： http://api.jqueryui.com/datepicker/#method-show