Question

我是html代码的新手，我已经为2个日期编写了一个简单的html代码。我想将max attribute date设置为今天的日期。但是得到错误"Uncaught TypeError: Cannot call method 'getElementById' of undefined" on line 17。我使用的是Chrome版本32.0.1700.107。但是，它适用于JSFiddle。

请求帮助

 <html>
 <head>
 <script>
 function getTodaysDate(){
date = new Date();
day = date.getDate();
month = date.getMonth() + 1;
year = date.getFullYear();

if (month < 10) month = "0" + month;
if (day < 10) day = "0" + day;

today = year + "-" + month + "-" + day; 

return today;
 }
 document.ss.getElementById('depdate').setAttribute('max', getTodaysDate());
 document.ss.getElementById('arrdate').setAttribute("max", getTodaysDate());

 </script>


 </head>

 <body onload= getTodaysDate()>

 <form name="ss" id="ss"
 <br>
 Departure date   :<input type="date" name="depdate" value="" ,  class="ss-q-date"         dir="auto" id="depdate" aria-label="Departure Date &amp; Time :  "><br>

 Arrival date     :<input type="date" name="arrdate" value="", class="ss-q-date" dir="auto" id="arrdate" aria-label="Arrival Date &amp; Time :  ">
 </br>
 </form>

 </body>
 </html>

Answer 1

这是因为，正如错误控制台报告的那样，form元素（与其他元素一样）没有getElementById()方法;替换form的引用，只需改为使用document.getElementById()。

function getTodaysDate() {
    date = new Date();
    day = date.getDate();
    month = date.getMonth() + 1;
    year = date.getFullYear();

    if (month < 10) month = "0" + month;
    if (day < 10) day = "0" + day;

    today = year + "-" + month + "-" + day;

    return today;
}
document.getElementById('depdate').setAttribute('max', getTodaysDate());
document.getElementById('arrdate').setAttribute("max", getTodaysDate());
//      ^-- removed '.ss'

JS Fiddle demo

此外，我建议通过在函数范围内声明它们来使用局部变量，以给出：

var date = new Date(),
    day = date.getDate(),
    month = date.getMonth() + 1,
    year = date.getFullYear();

而不是使用全局变量（省略var）。

JS Fiddle demo

最后，你做了两次相同的事情（填充日和月份到两位数），你应该把它作为一个单独的函数，以避免重复自己;并且不需要创建变量只是为了在下一行返回该变量。所以我建议，例如：

function zeropad(num) {
    return (num < 10 ? '0' : '') + num;
}

function getTodaysDate() {
    var date = new Date(),
        day = date.getDate(),
        month = date.getMonth() + 1,
        year = date.getFullYear();

    return year + "-" + zeropad(month) + "-" + zeropad(day);
}
document.getElementById('depdate').setAttribute('max', getTodaysDate());
document.getElementById('arrdate').setAttribute("max", getTodaysDate());

JS Fiddle demo

Answer 2

您有以下问题：

<form name="ss" id="ss"

应该是：

<form name="ss" id="ss">

然后这应该有效：

document.ss.getElementById('depdate').setAttribute('max', getTodaysDate());
document.ss.getElementById('arrdate').setAttribute("max", getTodaysDate());

或者，你可以直接引用像@David这样的元素：

document.getElementById('depdate').setAttribute('max', getTodaysDate());
document.getElementById('arrdate').setAttribute("max", getTodaysDate());

无法在html中将日期最大属性设置为今天的日期

2 个答案: