通过单击不带输入字段的图像打开JQuery日期选择器
通过单击不带输入字段的图像打开JQuery日期选择器
提问于 2009-07-10 21:18:27
我想让JQuery日期选择器在用户单击图像时打开。之后没有显示所选日期的输入字段；我将通过Ajax将输入的日期保存到服务器。
目前我有这样的代码：
<img src='someimage.gif' id="datepicker" />
$(document).ready(function() {
$("#datepicker").datepicker({
changeMonth: true,
changeYear: true,
}).click(function() { $(this).datepicker('show'); });
});但当我单击图像时，没有任何反应。我还尝试将datepicker()调用的结果保存到全局var，然后从图像的onclick()事件调用datepicker('show')，但结果相同。
回答 8
Stack Overflow用户
回答已采纳
发布于 2009-07-14 18:42:50
事实证明，一个简单的隐藏输入字段就可以完成这项工作：
<input type="hidden" id="dp" />然后使用图像的buttonImage属性，如normal：
$("#dp").datepicker({
buttonImage: '../images/icon_star.gif',
buttonImageOnly: true,
changeMonth: true,
changeYear: true,
showOn: 'both',
});最初，我尝试了一个文本输入字段，然后在其上设置了display:none样式，但这导致日历从浏览器顶部出现，而不是从用户单击的位置。但隐藏字段的工作方式与预期相符。
Stack Overflow用户
发布于 2009-07-10 21:39:03
jQuery文档指出，当datePicker不与输入框相关联时，需要将其附加到SPAN或DIV.你可以这样做：
<img src='someimage.gif' id="datepickerImage" />
<div id="datepicker"></div>
<script type="text/javascript">
$(document).ready(function() {
$("#datepicker").datepicker({
changeMonth: true,
changeYear: true,
})
.hide()
.click(function() {
$(this).hide();
});
$("#datepickerImage").click(function() {
$("#datepicker").show();
});
});
</script>Stack Overflow用户
发布于 2010-03-28 02:03:37
如果您使用的是输入字段和图标(如下例所示)：
<input name="hasta" id="Hasta" type="text" readonly />
<a href="#" id="Hasta_icono" ></a>你可以像这样将datepicker附加到你的图标上(在我的例子中，通过CSS在A标签中)：
$("#Hasta").datepicker();
$("#Hasta_icono").click(function() {
$("#Hasta").datepicker( "show" );
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/1112035
复制相关文章
相似问题