zoukankan      html  css  js  c++  java
  • mydate97时间插件集成jquery插件

    1.初始化JS:

    //把mydate97时间插件集成jquery插件
    (function ($) {
        $.fn.mydatePicker = function (options) {
            return this.each(function (i, target) {
    
                var _fmt = $(target).data('fmt');
                if (!_fmt) _fmt = 'yyyy-MM-dd';
                var defaults = {
                    autoUpdateOnChanged: true,
                    autoPickDate: true,
                    isShowClear: true,
                    readOnly: true,
                    isShowOK: true,
                    dateFmt: _fmt,
                    ychanged: function () {
    
                    },
                    Mchanged: function () {
    
                    },
                    dchanged: function () {
    
                    },
                    Hchanged: function () {
    
                    },
                    schanged: function () {
    
                    },
                    onSelected: function () {
    
                    },
                    oncleared: function () {
    
                    }
                };
    
                var optStr = $(target).data("options"), opt = {};
                if (optStr)
                    opt = eval("({" + optStr + "})");
                var opts = $.extend(defaults, opt, options);
                opts.el = $(target).get(0);
    
                if ($(target).hasClass("ui-validatebox")) {
                    $(target).off("focus").on("focus", function (e) {
    
                        if ($(target).attr("readonly")) {
                            setTimeout(function () {
                                $(target).trigger("mouseenter");
                            }, 200);
                            return;
                        }
                        var _d = $.data(e.target, "validatebox");
                        var _e = $(e.target);
                        _d.validating = true;
                        _d.value = undefined;
                        (function () {
                            if (_d.validating) {
                                if (_d.value != _e.val()) {
                                    _d.value = _e.val();
                                    if (_d.timer) {
                                        clearTimeout(_d.timer);
                                    }
                                    _d.timer = setTimeout(function () {
                                        $(e.target).validatebox("validate");
                                    }, _d.options.delay);
                                } else {
                                    //_f(e.target);
                                }
                                setTimeout(arguments.callee, 200);
                            }
                        })();
                    });
                }
                ;
    
    
                opts.onpicked = opts.oncleared = function () {
                    if ($(target).hasClass("ui-validatebox"))
                        $(target).validatebox("validate");
                    opts.onSelected();
                };
    
                //WdatePicker.call(target, opts);
                $(target).prop("readonly", opts.readOnly);
    
                //绑定
                $(target).unbind("click").bind("click", function (e) {
                    e.preventDefault();
                    e.stopPropagation();
                    WdatePicker(opts);
                });
    
    
            })
        }
    })(jQuery);
    $(document).ready(function () {
    
        $('.mydate').mydatePicker();
    
    })

    2.页面代码:

    <label>报表类型:<input id="dayOrHour" class="textBox" name="p1" value=""></label>
    <label>时间:<input type="text" id="time"  class="mydate readonly full-text" style="240px;height:24px;"></label>

    3.页面联动js:

    $('#dayOrHour').combobox({
      method: ajaxConfig.reqMtd,
      url: pageConfig.json.reportType,
       130,
      height: 32,
      panelHeight: 100,
      editable: false,
      onSelect:function(record){
        var $time= $("#time");
        if (record.text == "日报"){
          $time.clone().insertAfter($time[0]).mydatePicker({dateFmt: 'yyyy-MM-dd'});
          $time.remove();
        }
        else {
          $time.clone().insertAfter($time[0]).mydatePicker({dateFmt: 'yyyy-MM-dd HH'});
          $time.remove();
        }
      }
    });

    效果如下图:


     

  • 相关阅读:
    MVC3 缓存应用
    centos下安装tomcat
    VS2010安装完SP1后再安装Silverlight Tools 4遇到的问题解决办法
    TOMCAT多站点配置
    C#.NET 添加图片水印
    装了vs11后运行MVC3程序出问题
    ASP.NET Session的七点认识
    C# 用正则取文本中所有链接
    Long time no blog...
    从程序员到项目经理(二)
  • 原文地址:https://www.cnblogs.com/shuilangyizu/p/6757391.html
Copyright © 2011-2022 走看看