复制代码 代码如下: <BR><!-- <BR>.wr{font-size: 12pt; line-height: 22px} <BR>.wr1 { FONT-SIZE: 12px; LINE-HEIGHT: 200%} <BR>.wr2 { FONT-SIZE: 14px; LINE-HEIGHT: 200%} <BR>.wr3 { FONT-SIZE: 12px} <BR>.wr4 { FONT-SIZE: 12px; LINE-HEIGHT: 150%} <BR>// --> <BR> 日期自动输入控件 <BR>.date-picker-wp { <BR>display: none; <BR>position: absolute; <BR>background: #f1f1f1; <BR>left: 40px; <BR>top: 40px; <BR>border-top: 4px solid #3879d9; <BR>} <BR>.date-picker-wp table { <BR>border: 1px solid #ddd; <BR>} <BR>.date-picker-wp td { <BR>background: #fafafa; <BR>width: 22px; <BR>height: 18px; <BR>border: 1px solid #ccc; <BR>font-size: 12px; <BR>text-align: center; <BR>} <BR>.date-picker-wp td.noborder { <BR>border: none; <BR>background: none; <BR>} <BR>.date-picker-wp td a { <BR>color: #1c93c4; <BR>text-decoration: none; <BR>} <BR>.strong {font-weight: bold} <BR>.hand {cursor: pointer; color: #3879d9} <BR> <BR>var DatePicker = function () { <BR>var $ = function (i) <BR>{ <BR> return document.getElementById(i) <BR>}, <BR>addEvent = function (o, e, f) {o.addEventListener ? o.addEventListener(e, f, false) : o.attachEvent('on'+e, function(){f.call(o)})}, <BR>getPos = function (el) { <BR>for (var pos = {x:0, y:0}; el; el = el.offsetParent) { <BR>pos.x += el.offsetLeft; <BR>pos.y += el.offsetTop; <BR>} <BR>return pos; <BR>}; <BR>var init = function (n, config) { <BR>window[n] = this; <BR>Date.prototype._fd = function () {var d = new Date(this); d.setDate(1); return d.getDay()}; <BR>Date.prototype._fc = function () {var d1 = new Date(this), d2 = new Date(this); d1.setDate(1); d2.setDate(1); d2.setMonth(d2.getMonth()+1); return (d2-d1)/86400000;}; <BR>this.n = n; <BR>this.config = config; <BR>this.D = new Date; <BR>this.el = $(config.inputId); <BR>this.el.title = this.n+'DatePicker'; <BR>this.update(); <BR>this.bind(); <BR>}; <BR>init.prototype = { <BR>update : function (y, m) { <BR>var con = [], week = ['Su','Mo','Tu','We','Th','Fr','Sa'], D = this.D, _this = this; <BR>fn = function (a, b) {return '<td title="'+_this.n+'DatePicker" class="noborder hand" onclick="'+_this.n+'.update('+a+')">'+b+''}, <BR>_html = '<table cellpadding=0 cellspacing=2>'; <BR>y && D.setYear(D.getFullYear() + y); <BR>m && D.setMonth(D.getMonth() + m); <BR>var year = D.getFullYear(), month = D.getMonth() + 1, date = D.getDate(); <BR>for (var i=0; i<week.length; i++) con.push('<td title="'+this.n+'DatePicker" class="noborder">'+week[i]+''); <BR>for (var i=0; i<D._fd(); i++ ) con.push('<td title="'+this.n+'DatePicker" class="noborder"> '); <BR>for (var i=0; i<D._fc(); i++ ) con.push('<td class="hand" onclick="'+this.n+'.fillInput('+year+', '+month+', '+(i+1)+')">'+(i+1)+''); <BR>var toend = con.length%7; <BR>if (toend != 0) for (var i=0; i<7-toend; i++) con.push('<td class="noborder"> '); <BR>_html += '<tr>'+fn("-1, null", "<<")+fn("null, -1", "<")+'<td title="'+this.n+'DatePicker" colspan=3 class="strong">'+year+'/'+month+'/'+date+''+fn("null, 1", ">")+fn("1, null", ">>")+''; <BR>for (var i=0; i<con.length; i++) _html += (i==0 ? '<tr>' : i%7==0 ? '<tr>' : '') + con[i] + (i == con.length-1 ? '' : ''); <BR>!!this.box ? this.box.innerHTML = _html : this.createBox(_html); <BR>}, <BR>fillInput : function (y, m, d) { <BR>var s = this.config.seprator || '/'; <BR>this.el.value = y + s + m + s + d; <BR>this.box.style.display = 'none'; <BR>}, <BR>show : function () { <BR>var s = this.box.style, is = this.mask.style; <BR>s['left'] = is['left'] = getPos(this.el).x + 'px'; <BR>s['top'] = is['top'] = getPos(this.el).y + this.el.offsetHeight + 'px'; <BR>s['display'] = is['display'] = 'block'; <BR>is['width'] = this.box.offsetWidth - 2 + 'px'; <BR>is['height'] = this.box.offsetHeight - 2 + 'px'; <BR>}, <BR>hide : function () { <BR>this.box.style.display = 'none'; <BR>this.mask.style.display = 'none'; <BR>}, <BR>bind : function () { <BR>var _this = this; <BR>addEvent(document, 'click', function (e) { <BR>e = e || window.event; <BR>var t = e.target || e.srcElement; <BR>if (t.title != _this.n+'DatePicker') {_this.hide()} else {_this.show()} <BR>}); <BR>}, <BR>createBox : function (html) { <BR>var box = this.box = document.createElement('div'), mask = this.mask = document.createElement('iframe'); <BR>box.className = this.config.className || 'datepicker'; <BR>mask.src = 'javascript:false'; <BR>mask.frameBorder = 0; <BR>box.style.cssText = 'position:absolute;display:none;z-index:9999'; <BR>mask.style.cssText = 'position:absolute;display:none;z-index:9998'; <BR>box.title = this.n+'DatePicker'; <BR>box.innerHTML = html; <BR>document.body.appendChild(box); <BR>document.body.appendChild(mask); <BR>return box; <BR>} <BR>}; <BR>return init; <BR>}(); <BR>onload = function () { <BR>new DatePicker('_DatePicker_demo', { <BR>inputId: 'date-input', <BR>className: 'date-picker-wp', <BR>seprator: '-' <BR>}); <BR>} <BR>
