改变世界的是这样一群人,他们寻找梦想中的乐园,当他们找不到时,他们亲手创造了它

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="width:240px;height:24px;"></label>

3.页面联动js:

$('#dayOrHour').combobox({
  method: ajaxConfig.reqMtd,
  url: pageConfig.json.reportType,
  width: 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();
    }
  }
});

效果如下图:


 

posted @ 2017-04-24 16:12  水狼一族  阅读(860)  评论(0编辑  收藏  举报
改变世界的是这样一群人,他们寻找梦想中的乐园,当他们找不到时,他们亲手创造了它