http://www.jayui.com/jedate/ 這是日期控件官網，可以去里面下載使用
前台
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TimeStyle.aspx.cs" Inherits="PersonRecord.TimeStyle" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <link href="jedate/skin/jedate.css" rel="stylesheet" /> <%--樣式--%> <script src="jedate/jquery-1.7.2.js"></script> <script src="jedate/jquery.jedate.js"></script> <%--需要引用的腳本--%> <style> .laydate-icon { background: url(jedate/img/icon.png) no-repeat right; } .time { width: 249px; height: 15px; float: left; line-height: 15px; padding: 6px 0 6px 10px; border: 1px solid #C1C1C1; } </style> <script> $(function () { //第一種 這樣會先顯示日期在文本框中 $("#txtTest").jeDate({ 下面為參數的設置 isinitVal: true, festival: true, ishmsVal: false, format: "YYYY年MM月DD日", zIndex: 3000 }); //或者
$.jeDate("#txtTest",{ 參數設置 }) }) </script> </head> <body> <form id="form1" runat="server"> <div> <input class="time laydate-icon" type="text" id="txtTest" readonly='readonly' /> <input class="time laydate-icon" type="text" id="txtText11" name="txtText11" readonly='readonly' //一開始文本框上沒時間 onclick="$.jeDate('#txtText11', { insTrigger: false, isTime: true, format: 'YYYY-MM-DD hh:mm' });" /> </div> </form> </body> </html>
頁面
當你點擊文本框就會彈出日期
參數說明： 跟詳細就去官網查看
skinCell:"jedateblue", //日期風格樣式，默認藍色 format:"YYYY-MM-DD hh:mm:ss", //日期格式 minDate:"1900-01-01 00:00:00", //最小日期 maxDate:"2099-12-31 23:59:59", //最大日期 insTrigger:true, //是否為內部觸發事件，默認為內部觸發事件 startMin:"", //清除日期后返回到預設的最小日期 startMax:"", //清除日期后返回到預設的最大日期 isinitVal:false, //是否初始化時間，默認不初始化時間 initAddVal:[0], //初始化時間，加減 天 時 分 isTime:true, //是否開啟時間選擇 hmsLimit:true, //時分秒限制 ishmsVal:true, //是否限制時分秒輸入框輸入，默認可以直接輸入時間 isClear:true, //是否顯示清空 isToday:true, //是否顯示今天或本月 clearRestore:true, //清空輸入框，返回預設日期，輸入框非空的情況下有效 festival:false, //是否顯示農歷節日 fixed:true, //是否靜止定位，為true時定位在輸入框，為false時居中定位 zIndex:2099, //彈出層的層級高度 marks:null, //給日期做標注 choosefun:function(elem, val) {}, //選中日期后的回調, elem當前輸入框ID, val當前選擇的值 clearfun:function(elem, val) {}, //清除日期后的回調, elem當前輸入框ID, val當前選擇的值 okfun:function(elem, val) {}, //點擊確定后的回調, elem當前輸入框ID, val當前選擇的值 success:function(elem) {}, //層彈出后的成功回調方法, elem當前輸入框ID
注： 文件———》jeDate日期已上傳