コードをコピー コードは次のとおりです: 日期自動输入制御件 <br>.date-picker-wp { <br>表示: なし; <br>位置: 絶対。 <br>背景: #f1f1f1; <br>左: 40ピクセル; <br>トップ: 40ピクセル; <br>ボーダートップ: 4px ソリッド #3879d9; <br>} <br>.date-picker-wp table { <br>border: 1px ソリッド #ddd; <br>} <br>.date-picker-wp td { <br>背景: #fafafa; <br>幅: 22px; <br>高さ: 18px; <br>ボーダー: 1px ソリッド #ccc; <br>フォントサイズ: 12px; <br>text-align: 中央; <br>} <br>.date-picker-wp td.noborder { <br>ボーダー: なし; <br>背景: なし。 <br>} <br>.date-picker-wp td a { <br>color: #1c93c4; <br>テキスト装飾: なし。 <br>} <br>.strong {font-weight: 太字} <br>.hand {カーソル: ポインタ; 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.offsetParent) {<br>pos.x = el.offsetLeft; <br>pos.y = el.offsetTop; <br>} <br>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);戻り値 d.getDay()}; <br>Date.prototype._fc = function () {var d1 = 新しい日付 (この), d2 = 新しい日付 (この); d1.setDate(1); d2.setDate(1); d2.setMonth(d2.getMonth() 1);戻り値 (d2-d1)/86400000;}; <br>this.n = n; <br>this.config = 設定; <br>this.D = 新しい日付; <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 '</td>'}, <br>_html = '<table cellpadding=0 cellpacing=2>'; <br>y && D.setyear(D.getFull Year() y); <br>m && D.setMonth(D.getMonth() m); <br>var 年 = D.getFull Year()、月 = D.getMonth() 1、日付 = D.getDate(); <br>for (var i=0; i<week.length i con.push week>'); <br>for (var i=0; i<d._fd i con.push </td>>for (var i=0; i<D._fc(); i ) con.push('<td class="hand" onclick="' this.n '.fillInput(' year ', ' month ', ' (i 1) ')">' (i 1) '</td>'); <BR>var toend = con.length%7; <BR>if (toend != 0) for (var i=0; i<7-toend; i ) con.push('<td class="noborder"> </td>'); <br>_html = '<tr>' fn("-1, null", "<<") fn("null, -1", "<") '<td title="' this.n 'DatePicker"colspan=3 class=強い」>年 '/' 月 '/' 日付 '</td>' fn("null, 1", ">") fn("1, null", ">>") '</tr>'; <BR>for (var i=0; i<con.length; i ) _html = (i==0 ? '<tr>' : i%7==0 ? '</tr><tr> ' : '') con[i] (i == con.length-1 ? '</tr>' : ''); <BR>!!このボックス ? 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['表示'] = is['表示'] = 'ブロック'; <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 || '日付ピッカー'; <BR>mask.src = 'javascript:false'; <BR>マスク.フレームボーダー = 0; <BR>box.style.cssText = '位置:絶対;表示:なし;z-index:9999'; <BR>mask.style.cssText = '位置:絶対;表示:なし;z-index:9998'; <BR>box.title = this.n 'DatePicker'; <BR>box.innerHTML = html; <BR>document.body.appendChild(box); <BR>document.body.appendChild(マスク); <BR>返却ボックス; <BR>} <BR>}; <BR>初期化を返します; <BR>}(); <BR>onload = function () { <BR>new DatePicker('_DatePicker_demo', { <BR>inputId: 'date-input', <BR>className: 'date-picker-wp', <BR>seprator: ' -' <BR>}); <BR>} <BR> 生日: * >