Easyui 的日期控件单击文本框显示日历

Posted 幽默是一种心情

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Easyui 的日期控件单击文本框显示日历相关的知识,希望对你有一定的参考价值。

注意:可 用 ctrl+f 搜索 "_outerWidth():0

1. jQuery.easyui.min.js   1.3.2 版本  

function _745(_746,_747){
var opts=$.data(_746,"combo").options;
var _748=$.data(_746,"combo").combo;
var _749=$.data(_746,"combo").panel;
if(_747){
opts.width=_747;
}
if(isNaN(opts.width)){
var c=$(_746).clone();
c.css("visibility","hidden");
c.appendTo("body");
opts.width=c.outerWidth();
c.remove();
}
_748.appendTo("body");
var _74a=_748.find("input.combo-text");
var _74b = _748.find(".combo-arrow");
var _74c = opts.hasDownArrow ? _74b._outerWidth() : 0;

 
//datebox单击文本框出现日期选择
if ($(_746).hasClass("datebox-f"))
{
_74a.click(function () {
_74b.click();
});
}

//end

_748._outerWidth(opts.width)._outerHeight(opts.height);
_74a._outerWidth(_748.width()-_74c);
_74a.css({height:_748.height()+"px",lineHeight:_748.height()+"px"});
_74b._outerHeight(_748.height());
_749.panel("resize",{width:(opts.panelWidth?opts.panelWidth:_748.outerWidth()),height:opts.panelHeight});
_748.insertAfter(_746);
};

2. jQuery.easyui.min.js   1.3.6 版本  

function _83e(_83f,_840){  

var _841=$.data(_83f,"combo");  

var opts=_841.options;  

var _842=_841.combo;  

var _843=_841.panel;  

if(_840){  

opts.width=_840;  

}  

if(isNaN(opts.width)){  

var c=$(_83f).clone();  

c.css("visibility","hidden");  

c.appendTo("body");  

opts.width=c.outerWidth();  

c.remove();  

}  

_842.appendTo("body");  

var _844=_842.find("input.combo-text");  

var _845=_842.find(".combo-arrow");  

var _846=opts.hasDownArrow?_845._outerWidth():0;  

// datebox单击文本框出现日期选择 start  

if ($(_83f).hasClass("datebox-f")) {  

    _844.click(function() {  

        _845.click();  

    });  

}  

// end  

_842._outerWidth(opts.width)._outerHeight(opts.height);  

_844._outerWidth(_842.width()-_846);  

_844.css({height:_842.height()+"px",lineHeight:_842.height()+"px"});  

_845._outerHeight(_842.height());  

_843.panel("resize",{width:(opts.panelWidth?opts.panelWidth:_842.outerWidth()),height:opts.panelHeight});  

_842.insertAfter(_83f);  

};  

3. jQuery.easyui.min.js   1.4.3 版本  

if(isNaN(parseInt(opts.width))){  

var c=$(_4b2).clone();  

c.css("visibility","hidden");  

c.insertAfter(_4b2);  

opts.width=c.outerWidth();  

c.remove();  

}  

var _4b6=tb.is(":visible");  

if(!_4b6){  

tb.appendTo("body");  

}  

var _4b7=tb.find(".textbox-text");  

var btn=tb.find(".textbox-button");  

var _4b8=tb.find(".textbox-addon");  

var _4b9=_4b8.find(".textbox-icon");  

tb._size(opts,_4b5);  

//datebox单击文本框出现日期选择 start    

if ($(_4b2).hasClass("datebox-f")) {    

    _4b7.click(function() {   

        _4b9.click();   

    });    

}    

// end  

btn.linkbutton("resize",{height:tb.height()});  

btn.css({left:(opts.buttonAlign=="left"?0:""),right:(opts.buttonAlign=="right"?0:"")});  

_4b8.css({left:(opts.iconAlign=="left"?(opts.buttonAlign=="left"?btn._outerWidth():0):""),right:(opts.iconAlign=="right"?(opts.buttonAlign=="right"?btn._outerWidth():0):"")});  

_4b9.css({width:opts.iconWidth+"px",height:tb.height()+"px"});  

_4b7.css({paddingLeft:(_4b2.style.paddingLeft||""),paddingRight:(_4b2.style.paddingRight||""),marginLeft:_4ba("left"),marginRight:_4ba("right")});  

 

 

 

 

 

 

以上是关于Easyui 的日期控件单击文本框显示日历的主要内容,如果未能解决你的问题,请参考以下文章

excel窗体中打开日历控件能否自动显示系统日期

EasyUI日历控件

在日期控件中提取日期数据,并在另一个文本框中显示其年份加1 |

javascript——easyui日历控件问题

动态创建控件的日期选择器

Easyui datebox单击文本框显示日期选择 eayui版本1.5.4.1