WdatePicker插件获取点击触发事件

每日总结 同时被 3 个专栏收录
398 篇文章 2 订阅
65 篇文章 0 订阅
230 篇文章 0 订阅

一、onpicking 点击事件

选择日期后,关闭日期导航窗口前触发。

注意:自定义函数必须使用 function(dp){} 做完成嵌套,否则事件触发可能无效。

        错误示范:onpicking:selfFun() 

        正确示范:onpicking:function(dp){selfFun()}

    // HMLT
    <input type="text" class="form-control" readonly onclick="WdatePicker({dateFmt:'yyyy-MM-dd',onpicking:function(dp){pickFun(dp);}})"/>
     
    // JS
    function pickFun(dp){
        console.log("原来的日期为:"+dp.cal.getDateStr());
        console.log("新选择的日期为:"+dp.cal.getNewDateStr());
        alert("选择日期后关闭日期导航窗口前触发,此时已选择日期但是导航窗口还没有关闭。");
    }

 

 

二、onpicked 点击事件

选择日期后,关闭日期导航窗口后触发。

注意:自定义函数必须使用 function(dp){} 做完成嵌套,否则事件触发可能无效。

        错误示范:onpicked:selfFun() 

        正确示范:onpicked:function(dp){selfFun()}

 

    // HMLT
    <input type="text" class="form-control" readonly onclick="WdatePicker({dateFmt:'yyyy-MM-dd',onpicked:function(dp){pickFun(dp);}})"/>
     
    // JS
    function pickFun(dp){
        console.log("选择的日期为:"+dp.cal.getDateStr());
        alert("选择日期后关闭日期导航窗口后触发,此时已选择日期,导航窗口刚关闭。");
    }

三、打开日期导航窗口前触发方法

// HMLT
<input type="text" class="form-control" id="dataPick" />
 
// JS
$("#dataPick").click(function () {
    WdatePicker({
        dateFmt:'yyyy-MM-dd',
        readOnly:true,  // 设置只读
        opposite:true,  // 设置取反,将下面的配置取反
        disabledDates:['....-..-01','....-..-16'],  // 设置01号和16号不可选,取反后,仅01号16号可选
        specialDates:['....-..-01','....-..-16'],  // 设置01号和16号高亮显示
    });
    
    afterFun();    
});
 
function afterFun(){
    alert("打开日期导航窗口前触发,此时日期导航窗口还没打开。");
}

 

  • 0
    点赞
  • 0
    评论
  • 0
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

©️2021 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值