用JSP制作的日期選擇器 (轉)

我們在做web應用的時候，在很多情況下都需要操作人員在頁面上輸入日期之類的日期型字段信息。通常的做法是：XML:namespace prefix = o ns = "urn:schemas-microsoft-com:Office:office" />

1、用select標簽分別選擇年月日

2、給一個INPUT，并定義一個固定的格式，讓操作人員自己填寫

3、使用MICROSOFT提供的ActiveX DATETIMECONTROLLER。

然而這中方法均有缺陷，在1中雖然不會出現一些離譜的數據（如99月88日），但有效性驗證和后臺數據處理將消耗我們不少的時間和精力。而且一個操作頁面如果有較多個日期型字段，一定會給使用者帶來困擾。在2中用戶可以任意錄入年月日，一定會出現離譜的數據也存在有效性驗證和后臺處理等問題。MICROSOFT的ACTIVEX DATETIMECONTROLLER是個好東西，不過它的CLSID“又長又臭”很難記住 ，還有很多參數需要設置。如果對MICROSOFT的東西不了解，使用起來也方便不到哪兒去。再說不一定每個人的機器上都安裝了這個ACTIVEX控件。但是我在做這個日期選擇器的時候它給了我不小的啟發。下面是我在測試這個日期選擇器的一些畫面。

1．日期選擇前

JSP日期選擇器選擇前.GIF" align=baseline border=0>

2.日期選擇中

3.日期選擇后

結合給出的頁面我簡單的介紹一下使用方法，做一個需要輸入日期數據的頁面（見圖：日期選擇前）在點擊確定按鈕（如果將確定按鈕換成一個小圖標效果會更好，愿意動手的可以試一試）的時候會彈出jsp日期選擇器。我們可以用畫面（見圖：日期選擇中）中提供的按鈕來前后翻，也可以從下拉框中直接選擇。月份選擇有循環滾動功能給，即1月的前一個月是12月，12月的后一個月是1月，但不提供逢1月（前一月）和12月（后一月）時的年份的變化。如果有需要可以自己在源代碼上修改，估計也就是4行的工作兩。年份我設置在1970－2470之間。如果有需要，請自己動手修改吧。JSP日期選擇器的另一個特點時與星期的對齊是與日常使用的日歷對應的。選擇后的結果如圖“日期選擇后” 。不足之處是脫離了WEB SERVER不能使用。

下面給出源代碼：

1、testCalendar.jsp的源代碼

<%@ page contentType="text/html; charset=GBK" %>

2、IECalendar.jsp的源代碼

<%@ page contentType="text/html; charset=GB2312" %>

<%@ page import="java.util.Calendar" %>

<%@ page import="java.util.GregorianCalendar" %>

<%@ page import="java.util.Date" %>

<%

  int year=0;

  int month=0;

  int day=1;

  Date now=new Date();

  Calendar calendar=new GregorianCalendar();

  calendar.setTime(now);

  if((request.getParameter("year")!=null))

  {

  if((!request.getParameter("year").equals(""))||(!request.getParameter("year").trim().equals("")))

  {

   year=Integer.parseInt(request.getParameter("year"));

  }

  else

  {

   year=calendar.get(calendar.YEAR);

  }

  }

  else

  {

  year=calendar.get(calendar.YEAR);

  }

  if((request.getParameter("month")!=null))

  {

  if((!request.getParameter("month").equals(""))||(!request.getParameter("month").trim().equals("")))

  {

   month=Integer.parseInt(request.getParameter("month"));

  }

  else

  {

  month=Integer.parseInt(request.getParameter("month"));

  }

  }

  else

  {

  month=calendar.get(calendar.MONTH)+1;

  }

//  if((request.getParameter("day")!=null))

//  {

//  if((!request.getParameter("day").equals(""))||(!request.getParameter("day").trim().equals("")))

//  {

//  day=Integer.parseInt(request.getParameter("day"));

//  }

//  else

//  {

//  day=Integer.parseInt(request.getParameter("day"));

//  }

//  }

//  else

//  {

//  day=calendar.get(calendar.DAY_OF_MONTH);

//  }

%>

注意事項：請不要單獨使用IECalendar.jsp,應為會出錯，必須與另外一個包含了

并由

onClick="setDateField(document.abc.indate);tempstr=window.open('IECalendar.jsp','tony','dependent=yes,titlebar=no,width=465,height=275,location=no');tempstr.moveTo((screen.height-275)/2,(screen.width-475)/2);"

打開的窗口中才能正常工作。

有什么疑問和不足之處請發EMail通知我。

NAME:東尼

email:tonyzhangcn@sohu.com