<div class="codetitle"> <span><a style="CURSOR: pointer" data="31896" class="copybut" id="copybut31896" onclick="doCopy('code31896')"><u>コードをコピー</u></a></span> コードは次のとおりです:</div> <div class="codebody" id="code31896"> <br><html> <br> <br><title>很漂亮、兼容火狐のJs日期选择、自動充填到输入框</title> <br><meta http-equiv="content-Type" content="text/html;charset=gb2312"> <br><style type="text/css"> <br>body{font-size:12px;font-family:Verdana,Arial,"宋体";} <br>a:link {color:#464646;text-decoration:none;} <br>a:visited { color:#464646;text-decoration:none;} <br>a:hover{color:#ed145b;text-decoration:underline;} <br>a:active{color:#ed145b;text-decoration:underline;} <br>td{font-size:12px} <br>/*/*/ <br>/*DateCSS样式*/ <br>.header {font: 12px Arial, Tahoma !重要;font-weight: 太字 !重要;フォント: 11px Arial、タホマ;フォントの太さ: 太字;色: #154BA0;背景:#C2DEED;高さ: 25px;パディング左: 10px; <br>} <br>.header td {padding-left: 10px;} <br>.header a {color: #154BA0;} <br>.header input {background:none;vertical-align: middle;height: 16px;} <br>.category {font: 12px Arial、タホマ !重要;font: 11px Arial、タホマ;color: #92A05A;height:20px;background-color: #FFFFD9;} <br>.category td {border -bottom: 1px ソリッド #DEDEB8;} <br>.expire、.expire a:link、.expire a:visited {color: #999999;} <br>.default、.default a:link、.default a:visited {color: #000000;} <br>.checked、.checked a:link、.checked a:visited {color: #FF0000;} <br>.today、.today a:link、.today a:visited {color : #00BB00;} <br>#calendar_year {表示: なし;行の高さ: 130%;背景: #FFFFFF;位置: 絶対;z-index: 10;} <br>#calendar_year .col {浮動小数点: 左;背景: #FFFFFF;margin-left: 1px;border: 1px 実線 #86B9D6;padding: 4px;} <br>#calendar_month {表示: なし;背景: #FFFFFF;line-height: 130%;border: 1px 実線 # 86B9D6;パディング: 4px;位置: 絶対;z-index: 11;} <br>.tableborder {背景: 白;border: 1px 実線 #86B9D6;} <br>#year,#month{padding-right:10px; } <br></style> <br><スクリプト言語="javascript"> <br>//次の番号段落があれば、削除することができます <br>var ie =navigator.appName=="Microsoft Internet Explorer"?true:false; <br>function $(objID){ <br>return document.getElementById(objID); <br>} <br></script> <br></head> <br> <br><br><script type="text/javascript"> <br>var controlid = null; <br>var currdate = null; <br>var startdate = null; <br>var enddate = null; <br>var yy = null; <br>var mm = null; <br>var hh = null; <br>var ii = null; <br>var currday = null; <br>var addtime = false; <br>var today = new Date(); <br>var lastcheckedyear = false; <br>var lastcheckedmonth = false; <br>function _cancelBubble(event) { <br>e = イベント ?イベント : window.event ; <br>if(ie) { <br>e.cancelBubble = true; <br>} else { <br>e.stopPropagation(); <br>} <br>} <br>function getposition(obj) { <br>var r = new Array(); <br>r['x'] = obj.offsetLeft; <br>r['y'] = obj.offsetTop; <br>while(obj = obj.offsetParent) { <br>r['x'] = obj.offsetLeft; <br>r['y'] = obj.offsetTop; <br>} <br>r を返します。 <br>} <br>関数loadcalendar() { <br>s = ''; <br>s = '<div id="calendar" style="display:none;position:absolute;z-index:9;" onclick="_cancelBubble(イベント)">'; <br>if (ie) <br>{ <br>s = '<iframe width="200" height="160" src="about:blank" style="position:Absolute;z-index:-1 ;"></iframe>'; <BR>} <BR>s = '<div style="width: 200px;"><table class="tableborder" cellpacing="0" cellpadding="0" width="100%" style=" text-align: center">'; <BR>/// <BR>s = '<tr align="center" class="header"><td class="header"><a href="#" onclick="refreshcalendar( yy, mm-1);return false" title="上一月"><<</a></td><tdcolspan="5" style="text-align: center" class="header"><a href="#" onclick="showdiv('year');_cancelBubble(event);return false" title="点击选择年份" id="year"></ > - <a id="month" title="点击选择月份" href="#" onclick="showdiv('month');_cancelBubble(event);return false"></a></td> ;<td class="header"><A href="#" onclick="refreshcalendar(yy, mm 1);return false" title="下一月">>></A> ;</td></tr>'; <br>s = '<tr class="category"><td>日</td><td>一</td><td>二</td><td>三</td><td>四</td><td>五</td><td>六</td></tr>'; <br>for(var i = 0; i s = '<tr class="altbg2">'; <br>for(var j = 1; j s = "<td id='d"' j height="19">0</td> "; <br>s = "</tr>"; <BR>} <BR>s += '<tr id="hourminute"><td colspan="7" align="center"><input type="text" size="1" value="" id="hour" onKeyUp=\'this.value=this.value > 23 ? 23 : zerofill(this.value);controlid.value=controlid.value.replace(/\\d+(\:\\d+)/ig, this.value+"$1")\'> 点 <input type="text" size="1" value="" id="minute" onKeyUp=\'this.value=this.value > 59 ? 59 : zerofill(this.value);controlid.value=controlid.value.replace(/(\\d+\:)\\d+/ig, "$1"+this.value)\'> 分</td></tr>'; <br>s += '</table></div></div>';/// <br>s += '<div id="calendar_year" onclick="_cancelBubble(event)"><div class="col">'; <br>for(var k = 1930; k <= 2019; k++) { <br>s += k != 1930 && k % 10 == 0 ? '</div><div class="col">' : ''; <br>s += '<a href="#" onclick="refreshcalendar(' + k + ', mm);$(\'calendar_year\').style.display=\'none\';return false"><span' + (today.getFullYear() == k ? ' class="today"' : '') + ' id="calendar_year_' + k + '">' + k + '</span></a><br />'; <br>} <br>s += '</div></div>'; <br>s += '<div id="calendar_month" onclick="_cancelBubble(event)">'; <br>for(var k = 1; k <= 12; k++) { <BR>s += '<a href="#" onclick="refreshcalendar(yy, ' + (k - 1) + ');$(\'calendar_month\').style.display=\'none\';return false"><span' + (today.getMonth()+1 == k ? ' class="today"' : '') + ' id="calendar_month_' + k + '">' + k + ( k < 10 ? ' ' : '') + ' 月</span></a><br />'; <br>} <br>s += '</div>'; <br>var nElement = document.createElement("div"); <br>nElement.innerHTML=s; <br>document.getElementsByTagName("body")[0].appendChild(nElement); <br>//document.write(s); <br>document.onclick = function(event) { <br>$('calendar').style.display = 'none'; <br>$('calendar_year').style.display = 'none'; <br>$('calendar_month').style.display = 'none'; <br>} <br>$('calendar').onclick = function(event) { <br>_cancelBubble(event); <br>$('calendar_year').style.display = 'none'; <br>$('calendar_month').style.display = 'none'; <br>} <br>} <br>関数 parsedate(s) { <br>/(d )-(d )-(d )s*(d*):?(d*)/.exec(s) ; <br>var m1 = (RegExp.$1 && RegExp.$1 > 1899 && RegExp.$1 var m2 = (RegExp.$2 && (RegExp.$2 > 0 && RegExp.$2 var m3 = (RegExp.$3 && (RegExp.$3 > 0 && RegExp.$3 var m4 = (RegExp.$4 && (RegExp.$4 > -1 && RegExp.$4 var m5 = (RegExp.$5 && (RegExp.$5 > -1 && RegExp.$5 /(d )-(d )-(d )s*(d*):?(d*)/.exec("0000-00-00 00:00"); <br>新しい日付を返します(m1, m2 - 1, m3, m4, m5); <br>} <br>function settime(d) { <br>$('calendar').style.display = 'none'; <br>controlid.value = yy "-" zerofill(mm 1) "-" zerofill(d) (addtime ? ' ' zerofill($('hour').value) ':' zerofill($('分') 。価値） ： ''）; <br>} <br>function showcalendar(event, controlid1, addtime1, startdate1, enddate1) { <br>controlid = controlid1; <br>追加時間 = 追加時間1; <br>開始日 = 開始日1 ? parsedate(startdate1) : false; <br>enddate = enddate1 ? parsedate(enddate1) : false; <br>currday = controlid.value ? parsedate(controlid.value) : 今日; <br>hh = currday.getHours(); <br>ii = currday.getMinutes(); <br>var p = getposition(controlid); <br>$('calendar').style.display = 'ブロック'; <br>$('calendar').style.left = p['x'] 'px'; <br>$('calendar').style.top = (p['y'] 20) 'px'; <br>_cancelBubble(イベント); <br>refreshcalendar(currday.getFull Year(), currday.getMonth()); <br>if(lastcheckedyear != false) { <br>$('calendar_year_' lastcheckedyear).className = 'default'; <br>$('calendar_year_' today.getFull Year()).className = 'today'; <br>} <br>if(lastcheckedmonth != false) { <br>$('calendar_month_' lastcheckedmonth).className = 'default'; <br>$('calendar_month_' (today.getMonth() 1)).className = 'today'; <br>} <br>$('calendar_year_' currday.getFull Year()).className = 'checked'; <br>$('calendar_month_' (currday.getMonth() 1)).className = 'checked'; <br>$('hour minutes').style.display = addtime ? '' ： 'なし'; <br>lastcheckedyear = currday.getFull Year(); <br>lastcheckedmonth = currday.getMonth() 1; <br>} <br>function freshcalendar(y, m) { <br>var x = new Date(y, m, 1); <br>var mv = x.getDay(); <br>var d = x.getDate(); <br>var dd = null; <br>yy = x.getFullyear(); <br>mm = x.getMonth(); <br>$("年").innerHTML = yy; <br>$("month").innerHTML = mm 1 > 9? (mm 1) : '0' (mm 1); <br>for(var i = 1; i dd = $("d" i); <br>dd.innerHTML = " "; <br>dd.className = ""; <br>} <br>while(x.getMonth() == mm) { <br>dd = $("d" (d mv)); <br>dd.innerHTML = '<a href="###" onclick="settime(' d ');return false">' d '</a>'; <br>if(x.getTime() < today.getTime() || (enddate && x.getTime() > enddate.getTime()) || (startdate && x.getTime() < startdate.getTime ())) { <br>dd.className = '期限切れ'; <br>} else { <br>dd.className = 'デフォルト'; <br>} <br>if(x.getFull Year() == today.getFull Year() && x.getMonth() == today.getMonth() && x.getDate() == today.getDate()) { <br>dd.className = '今日'; <br>dd.firstChild.title = '今天'; <br>} <br>if(x.getFull Year() == currday.getFull Year() && x.getMonth() == currday.getMonth() && x.getDate() == currday.getDate()) { <br>dd.className = 'チェック済み'; <br>} <br>x.setDate( d); <br>} <br>while(d mv dd = $("d" (d mv)); <br>dd.innerHTML = " "; <br>d ; <br>} <br>if(addtime) { <br>$('hour').value = zerofill(hh); <br>$('分').value = zerofill(ii); <br>} <br>} <br>function showdiv(id) { <br>var p = getposition($(id)); <br>$('calendar_' id).style.left = p['x'] 'px'; <br>$('calendar_' id).style.top = (p['y'] 16) 'px'; <br>$('calendar_' id).style.display = 'ブロック'; <br>} <br>function zerofill(s) { <br>var s = parseFloat(s.toString().replace(/(^[s0] )|(s $)/g, '')); <br>s = isNaN(s) ? 0:秒; <br>return (s }<br>loadcalendar(); <br></script> <br>用法演示：<br>请选择日期：<input name="member.birth" type="text" value="2008-5-19" size="14" readonly onclick="showcalendar(event) 、これ）;" onfocus="showcalendar(event, this);if(this.value=='0000-00-00')this.value=''"> <br></body> <br></html> <br> </tr> </div>
