Jquery日期picker日历图标定位

Jquery datepicker calendar icon positioning

本文关键字:图标 定位 日历 picker 日期 Jquery      更新时间:2023-09-26

我正在使用jquery-ui日期拾取器。问题是,默认情况下,库直接在输入字段后插入日历图标。但是我的HTML标记有点不同,我希望日历图标出现在DOM的其他地方,即在输入字段的父容器之外。

我甚至尝试手动添加我自己的<img/>并添加类ui-datepicker-trigger,但它没有触发任何东西。

我怎么能决定图标应该出现在DOM和它必须工作的地方?

这就是我想要的:

<div class="parent">
    <input id="datepicker" class="hasDatepicker" type="text" />
</div>
<img class="ui-datepicker-trigger" src="images/calendar.gif" alt="..." title="..." />

不是这个(默认的jquery-ui插入):

<input id="datepicker" class="hasDatepicker" type="text" />
<img class="ui-datepicker-trigger" src="images/calendar.gif" alt="..." title="..." />

多谢

尝试手动添加将在图像上显示日期选择器的触发器:

$("#datepickerImage").click(function() {
    $("#datepicker").datepicker( "show" );; 
});

try this

$(selector).datepicker({showOn: 'button', buttonImage: 'img/cal.gif',
      buttonImageOnly: true, buttonText: 'Open calendar'});

看到