这种日期时间插件很多,平时也积累了几个好用的,但使用easyui后就使用它自带的datetimebox,发现一个问题,在通用的查询框中,一般都会回显上次的查询时间,但如果通过手动清除后再次查询,发现近清楚不掉了,十分的坑娘,经过一番折腾后,搞定了它。
1、在你的input元素中data-options,添加“buttons:buttons”属性,如:
<input type="text" class="easyui-datetimebox" name="timeStampStart" id="timeStampStart" value="${timeStampStart}" data-options="required:false,showSeconds:true,buttons:buttons" style="width: 150px">
2、在其前面添加一段js代码,如下:
<script>
<span style="white-space:pre"> </span>var buttons=$.extend([],$.fn.datetimebox.defaults.buttons);
<span style="white-space:pre"> </span>buttons.splice(3,0,{
<span style="white-space:pre"> </span>text:'清空',
<span style="white-space:pre"> </span>handler:function(target){
<span style="white-space:pre"> </span>$("#"+target.id).datebox("setValue","");
<span style="white-space:pre"> </span>$("#"+target.id).datebox("hidePanel");
<span style="white-space:pre"> </span>}
<span style="white-space:pre"> </span>});
<span style="white-space:pre"> </span></script>
这里要说明的,如果你的页面中有好几个这样的datetimebox的话,需要通过它的回调方法,即function(target){......}中有甄别的去清除。