Question

我有一个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格式显示日期文本框旁边的日历。。。

我经历了很多事情，尝试过这些，但实际上无法获得预期的输出。下面是我到目前为止实现的代码

     <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 /％m /％Y”，//日期格式按钮：“imgCal”//日历图像的ID } ）;

我是否真的需要创建一个日历对象，如果是，我可以知道在哪里。另外，我应该在哪里将Calendar.setup代码放在我的jsp页面中？

有人可以帮我解决这个问题......

Answer 1

快速建议：您是否尝试过查看此页面。

易于实施，您也可以看到该演示。

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

**

现在，查看您的代码;你可以点击calender.setup（foo1，foo2 ...）函数实现吗？（这是您的自定义库吗？）

谢谢，

Answer 2

我正在尝试使用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>

如果有帮助，那么进行投票....

使用.js文件在javascript中验证日期

2 个答案: