My97DatePicker日期控件

不问归期 提交于 2019-11-30 03:03:18

使用案例

  1. 首先到My97DatePicker官网下载 My97DatePicker的安装文件,然后解压。

  2. 把下载后的My97DatePicker解压后放在webapp子目录下,如webapp/js/plugins/My97DatePicker

  1. 引用My97DatePicker,在要使用的jsp页面中引入js,如下
<script type="text/javascript" src="/js/plugins/My97DatePicker/WdatePicker.js"></script>
  1. 调用My97DatePicker,如下

    格式为:

<input class="Wdate" type="text" id="pageEndTime" style="width: 150px;"
                                              onFocus="WdatePicker({isShowClear:true,readOnly:true,dateFmt:'yyyy-MM-dd HH:mm:ss'})" />

//格式:2012-09-12
<input id="endDate"  readonly="readonly" onfocus="WdatePicker({isShowWeek:true})" /> 
//格式:2012-09-12 12:23:22
<input id="endDate"  readonly="readonly" onfocus="WdatePicker({skin:'whyGreen',dateFmt:'yyyy-MM-dd HH:mm:ss',minDate:'2008-03-08 11:30:00',maxDate:'2100-03-10 20:59:30'})"
 />

注意

Vue中的v-model与my97日期选择插件冲突

日期插件的实现是:选择好日期后,将值赋给input框,然而此时并没有绑定到vue的数据中 后来采取的做法是:查询my97的API,找到选择日期的回调函数,在回调函数里将选择的值赋给vue的数据 至此,该问题算是完成了。

后来,测试又报出一个bug,当用户选择input框之后,没有从日期框选择日期,而是手动修改input内的数值, 发现还是没有绑定到vue上,猜测原因是:my97插件内部给该input框又实现了一个input事件,该事件后触发。 所以vue并没有获取到修改的值 后来采取的做法是:去掉v-model绑定,在需要获取该值的地方使用jquery的方式获取

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!