zoukankan      html  css  js  c++  java
  • My97DatePicker 日历控件

     My97DatePicker 是一款非常强大的日历控件,使用也非常简单,也能修改源码,牛逼我就不吹了,自己用用看

    使用

    1.引入

    <script language="javascript" type="text/javascript" src="${pageContext.request.contextPath}/My97DatePicker/WdatePicker.js"></script>

    2.代码

    <input id="d46" type="text" class="Wdate" onclick="WdatePicker({opposite:true,minDate:'2018-09-07',maxDate:'2018-10-28',disabledDates:['2018-09-27','2018-10-28']})"/>

    3.解释

    minDate:'2018-09-07',最小日期
    maxDate:'2018-10-28'最大日期
    disabledDates:设置不可用日期
    opposite:true、disabledDates:['2018-09-27','2018-10-28']可用日期
    '2018-09-27','2018-10-28'

    opposite:false、disabledDates:['2018-09-27','2018-10-28']不可用日期
    '2018-09-27','2018-10-28'

    更多参考@官网文档

    4.下载链接可直接去官网,也可以下面的
    My97DatePicker.rar


    适配wap(官网要求不对外扩散),想要的可以私聊我,我就不放出来了。只更改了datepicker.css
    My97DatePicker_Wap.rar

    5.onchange事件
    由于看不到源码,查看了众多网友的资料,发现此插件禁用了该函数。但是否有办法实现呢?还是有的,但效果有限
    5.1,官网提供的年月日时分秒的 changing和changed事件

    年月日时分秒都有对应的changing和changed事件,分别是:
    ychanging ychanged 
    Mchanging Mchanged
    dchanging dchanged
    Hchanging Hchanged
    mchanging mchanged
    schanging schanged 

    由于它们实际作用有限,我就不介绍了,想用可以看官网

     5.2 onpicked事件

    你可以这样定义控件:

    onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm',onpicked:function(){return onpicked(this)}});"
    function onpicked(obj){
        console.log($(obj).val());
        return true;
    }

    注意,不能用alert,否则日历框会失去焦点,无法将选择的值赋值

  • 相关阅读:
    【jQuery UI 1.8 The User Interface Library for jQuery】.学习笔记.2.更换主题
    【jQuery UI 1.8 The User Interface Library for jQuery】.学习笔记.1.CSS框架和其他功能
    终于要开始做大名鼎鼎的BombLab了!
    初识linux内核漏洞利用
    控制转移指令分类与机器码
    Kali Linux信息收集工具全集
    Kali Linux 弱点分析工具全集
    DockerScan:Docker安全分析&测试工具
    SNORT入侵检测系统
    Woobuntu
  • 原文地址:https://www.cnblogs.com/yanan7890/p/9266821.html
Copyright © 2011-2022 走看看