jqueryui datepicker点击今天按钮如何设置控件值
2015-11-4更新:自己重写jqueryui datepicker的_gotoToday私有方法也行
$.datepicker._gotoToday = function (id) { $(id).datepicker('setDate', new Date()).datepicker('hide').blur(); };
jqueryui的datepicker插件点击今天按钮时,只是跳转到当天所在的月份,而不是设置控件的值为今天。要想点击今天这个按钮后设置控件值为当天的内容,可以自己写代码来实现。获取datepicker弹出层对象,添加click事件,判断点击的是今天这个按钮,延时获取日期弹出层包含ui-datepicker-today样式的td,然后出发下click事件即可。
jqueryui datepicker点击今天按钮后设置控件值为当前日期源代码如下
<p>Date: <input type="text" id="datepicker"></p> <script> $(function () { var picker = $("#datepicker").datepicker({ showButtonPanel: true, currentText: "今天" }).datepicker('widget');//获取日期选择器容器 picker.click(function (e) {//给容器添加click事件(因为没有点击过日期输入框弹出选择器,此时选择器容器是没有内容的,只能给容器添加click事件) var o = e.target;//事件对象中target存储的为点击的实际对象 if ($(o).hasClass('ui-datepicker-current')) {//为当前这个按钮 setTimeout(function () {//延时执行代码,当天td包含ui-datepicker-today样式,所以获取td触发下click事件 picker.find('td.ui-datepicker-today').trigger('click'); }, 10); } }); }); </script>
示例在jquery-ui-1.8.16,jquery-ui-1.10.3,jquery-ui-1.10.4下测试成功,其他版本大同小异,如果没效果自己查看DOM结构修改下相关样式。
加支付宝好友偷能量挖...
原创文章,转载请注明出处:jqueryui datepicker点击今天按钮如何设置控件值