首頁 > 開發者 > JavaScript
不多說，先
看到了吧，效果還是不錯的。而且後面兩個可以選擇具體到時間分鐘。個人比較喜歡第二個，而且都是OS的。
下面就不多哈了。:)
其實也沒什麼多說的，也就是在自己的項目中匯入JavaScript庫和Stylesheet樣式檔案，那就直接上代碼，
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %><br /><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><br /><html xmlns="http://www.w3.org/1999/xhtml"><br /><head runat="server"><br /> <title>無標題頁</title><br /> <mce:script language="javascript" type="text/javascript" src="js/script.js" mce_src="js/script.js"></mce:script><br /> <mce:script language="javascript" type="text/javascript" src="Tools/My97DatePicker/WdatePicker.js" mce_src="Tools/My97DatePicker/WdatePicker.js"></mce:script><br /> <mce:script type="text/javascript" src="js/JScript.js" mce_src="js/JScript.js" ></mce:script><br /> <link type="text/css" rel="Stylesheet" href="App_Themes/theme/StyleSheet.css" mce_href="App_Themes/theme/StyleSheet.css"/><br /></head><br /><body><br /> <form id="form1" runat="server"><br /> <div><br /> <div id="frist"><br /> <table><br /> <tr><br /> <td style="width:400px"><br /> <input id="tb_CheckInDate" type="text"/><input type="button" onclick="setday(this,document.all.tb_CheckInDate)" value="..."/><br /> </td><br /> <td style="width:400px"><br /> <input type="text" onfocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm'})" /><br /> </td><br /> <td style="width:400px"><br /> <input class="input" type="text" name="bgntime" style="width:120" value="" id="bgntime" onClick="showCal(bgntime);"><br /> <div id="dateTime" onclick="event.cancelBubble=true" style="position:absolute;visibility:hidden;width:100px;height:100px;left:0px;top:0px;z-index:100;"><br /> <table class="cal_table" border="0"><br /> <tr><br /> <td><br /> <mce:script type="text/javascript"><!--<br /> var c = new CalendarCalendar('c');document.write(c);<br />// --></mce:script><br /> </td><br /> </tr><br /> <tr><br /> <td valign="top" align="center"><br /> <mce:script type="text/javascript"><!--<br /> var m = new CalendarMinute("m");document.write(m);<br />// --></mce:script><br /> </td><br /> </tr><br /> </table><br /> <iframe src="javascript:false" mce_src="javascript:false" style="height:200px;" class="menu_iframe"></iframe><br /> </div><br /> <mce:script event="onclick()" for="document"><!--<br />hideCalendar()<br />// --></mce:script><br /> </td><br /> </tr><br /> </table><br /> </div><br /> <div id="second"><br /> </div><br /> </div><br /> </form><br /></body><br /></html><br />
主要的關鍵代碼也就是上面的，這幾條是匯入指令碼庫和樣式表的，如下；
<mce:script language="javascript" type="text/javascript" src="js/script.js" mce_src="js/script.js"></mce:script><br /> <mce:script language="javascript" type="text/javascript" src="Tools/My97DatePicker/WdatePicker.js" mce_src="Tools/My97DatePicker/WdatePicker.js"></mce:script><br /> <mce:script type="text/javascript" src="js/JScript.js" mce_src="js/JScript.js" ></mce:script><br /> <link type="text/css" rel="Stylesheet" href="App_Themes/theme/StyleSheet.css" mce_href="App_Themes/theme/StyleSheet.css"/>
值得說明的地方是，在使用第2張控制項時，需要引入如的整個Tools檔案夾
最後提供下示範代碼:http://download.csdn.net/source/2009643
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
