在JavaScript中使用.js文件進行日期驗證

我有一個ini.jsp頁面用於創建一個表單，用於向輸入日期添加兩個文本字段，然後在ini.jsp頁面中使用JavaScript來驗證這些日期。我現在有一些庫文件（calendar.js，calendar-en.js，calendar-setup.js，calendar_1.png，calendar_system.css）。現在我的問題是如何將這些文件鏈接到JavaScript（我正在使用ECLIPSE IDE），以便日期格式爲dd/mm/yyyy的文本框旁邊顯示日曆。。。在JavaScript中使用.js文件進行日期驗證

我已經經歷了很多東西，試圖做到這些，但真的無法獲得預期的輸出。下面是我已實施至今

 <html lang="en"> 
     <head> 
     <style type="text/css" src="../datePickers/calendar-system.css"> 
     </style> 
     </head> 
     <body> 
    <script language="Javascript" src="../Scripts/calendar.js"></script> 

<h1>Report Generation</h1> 

<div style="margin: 0 auto; width: 100%; text-align: left"> 

    <form name="date" action="<c:url value="cli.htm"/>" 
     method="post" onSubmit="return ValidateForm()"> 
     <fieldset> 
      <legend>Please enter Start Date and End Date</legend> 

       <div style="text-align: center; margin: 150px auto 100px auto;"> 
    <label for="dateFrom">Start Date:</label> 
      <font color="#CC0000"><b>(dd/mm /yyyy)</b></font> 
      <input type="text" name="dateFrom" maxlength="25" size="25" 
        id="dateFrom" /> 
    <img src = "../Images/calendar_1.png" onclick="javascript:Calendar.setup(inputField,ifFormat,button) style="cursor: pointer" /> 
      </div> 


    <div style="text-align: center; margin: 150px auto 100px auto;"> 
    <label for="dateTo">End Date:</label> 
      <font color="#CC0000"><b>(dd/mm/yyyy)</b></font> 
    <input type="text" name="dateTo" maxlength="25" size="25" 
        id="dateTo" /> 
      </div> 

      <div> 
    <input type="submit" value="Generate Report" align="center" /> 
      </div> 
    </form> 
     </div> 


      <script language="Javascript" > 
      var dtCh= "/"; 
     var minYear=1900; 
     var maxYear=2500; 

     function isInteger(s){ 
    var i; 
      for (i = 0; i < s.length; i++){ 
    // Checking that the current character is number. 
      var c = s.charAt(i); 
     if (((c < "0") || (c > "9"))) 
     return false; 
      } 
// All characters are numbers. 
       return true; 
       } 

       function stripCharsInBag(s, bag){ 
      var i; 
        var returnString = ""; 
// Search through string's characters one by one. 
// If character is not in bag, append to returnString. 
        for (i = 0; i < s.length; i++){ 
      var c = s.charAt(i); 
      if (bag.indexOf(c) == -1) returnString += c; 
      } 
      return returnString; 
         } 

        function daysInFebruary (year){ 

        return (((year % 4 == 0) && ((!(year % 100 == 0)) || (year % 400 == 0))) ? 29 : 28); 
        } 

        function DaysArray(n) { 
       for (var i = 1; i <= n; i++) { 
      this[i] = 31 
      if (i==4 || i==6 || i==9 || i==11) {this[i] = 30} 
      if (i==2) {this[i] = 29} 
        } 
        return this 
         } 


       function isDate(dtStr){ 

       var daysInMonth = DaysArray(12) 
       var pos1=dtStr.indexOf(dtCh) 
       var pos2=dtStr.indexOf(dtCh,pos1+1) 
       var strDay=dtStr.substring(0,pos1) 
       var strMonth=dtStr.substring(pos1+1,pos2) 
        var strYear=dtStr.substring(pos2+1) 
           strYr = strYear 
       if (strDay.charAt(0)=="0" && strDay.length>1) strDay=strDay.substring(1) 
if (strMonth.charAt(0)=="0" && strMonth.length>1) strMonth=strMonth.substring(1) 
for (var i = 1; i <= 3; i++) { 
    if (strYr.charAt(0)=="0" && strYr.length>1) strYr=strYr.substring(1) 
} 
month=parseInt(strMonth) 
day=parseInt(strDay) 
year=parseInt(strYr) 
if (pos1==-1 || pos2==-1){ 
    alert("The date format should be : dd/mm/yyyy"); 
    return false; 
} 
if (strMonth.length<1 || month<1 || month>12){ 
    alert("Please enter a valid month"); 
    return false; 
} 
if (strDay.length<1 || day<1 || day>31 || (month==2 && day>daysInFebruary(year)) || day > daysInMonth[month]){ 
    alert("Please enter a valid day"); 
    return false; 
} 
if (strYear.length != 4 || year==0 || year<minYear || year>maxYear){ 
    alert("Please enter a valid 4 digit year between "+minYear+" and "+maxYear); 
    return false; 
} 
if (dtStr.indexOf(dtCh,pos2+1)!=-1 || isInteger(stripCharsInBag(dtStr, dtCh))== false){ 
    alert("Please enter a valid date"); 
    return false; 
} 
     return true; 
      } 


       function ValidateForm(){ 
      var dt1=document.date.dateFrom 
     var dt2=document.date.dateTo 

     if (!isDate(dt1.value)){ 
    dt1.value=''; 
    dt1.focus(); 
    return false; 
} 
if(!isDate(dt2.value)){ 
    dt2.value=''; 
    dt2.focus(); 
    return false; 
} 


    return true 
    } 


    } 
    </script> 
    </body> 
    </html>

我想在代碼的變化必須要使用的代碼：

的代碼應該初始化日曆對象和圖像鏈接到一個文本字段（使用其ID）來響應點擊。

Calendar.setup（ { inputField：「dateFrom」，//輸入字段的ID ifFormat：「％d /％米/％Y」，//日期格式按鈕：「imgCal」/ /日曆圖像的ID } ）;

我真的需要創建一個日曆對象，如果是的話，我可以知道在哪裏。另外，我應該在哪裏放置Calendar.setup代碼到我的jsp頁面？

有人可以幫我理清這個問題...

來源

2012-02-15 sonu

快速的建議：你試圖尋找到這個頁面。

易於實現，你也可以看到演示。

http://www.kelvinluck.com/assets/jquery/datePicker/v2/demo/

現在，展望到你的代碼;你可以請輕彈calender.setup（foo1，foo2 ...）函數實現嗎？（這是你的自定義庫？）

感謝，

來源

2012-02-15 00:33:59

感謝您寶貴的意見。我已經通過你的鏈接，但不能;我不知道我應該做什麼..你可以找出是否有任何代碼中的錯誤或任何更改... calendar.setup.js文件是庫文件。我們是否需要爲此創建一個對象？我認爲只有params應該提到..你可以進一步解釋我怎麼能做到這一點？ – sonu 2012-02-15 01:10:10

Hiya，很高興我能幫忙，我們會到達那裏：所以如果我能正確理解這個，你想讓日曆出現在這個文本框旁邊嗎？你可以在你的日曆或圖像上添加一個css作爲該文本框旁邊的隱藏html標記，並且當檢查有效日期[在這種情況下是isDate]時，可以根據該檢查顯示日曆。 ** .show或.hide根據您的日期驗證？希望這可以幫助。 – 2012-02-15 01:58:57

你可以舉一個例子或代碼來說明這是如何工作的......謝謝！ – sonu 2012-02-15 02:50:58

我試圖驗證日期**使用HTML和Javascript 格式YYYY \ MM \ DD希望其幫助你... 試給自己...

< script type = "text/javascript" > 
 
    function valdate() { 
 
    var regdate = /^(19[0-9][0-9]|20[0-9][0-9])\/(0[1-9]|1[012])\/(0[1-9]|[12][0-9]|3[01])$/; 
 
    if (form1.txtdate.value.match(regdate)) { 
 
     return true; 
 
    } else { 
 
     alert("! please Enter the Date in this Format 'YYYY/MM/DD'"); 
 
     form1.txtdate.value = ""; 
 
     form1.txtdate.focus(); 
 
     return false; 
 
    } 
 
    } < /script>

<from="form1" method="post" action=""> 
 
    <input name="txtdate" type="text" onblur="valdate()" maxlength="10" required /> 
 
    </form>

如果有用的，這樣化妝投票....

來源

2015-02-27 10:46:23

在JavaScript中使用.js文件進行日期驗證

回答

相關問題