Javascript代码将圣诞节剩余时间留给任何输出

时间:2014-05-31 14:24:38

标签: javascript html

我编写此代码以在表格内的输入标记中显示当前日期和圣诞节剩余的天数。相同的代码如果没有保存在表单/表中(只是普通的js,document.write),但是当我将它保存在表格和表格中时,它不会提供任何输出。请帮我纠正错误。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Question 4</title>

    <script language="javascript">

    document.write("<h1> Question 4 </h1>");    

    myDate = new Date(); 
    xmas = Date.parse("Dec 25, "+myDate.getFullYear()); 
    today = Date.parse(myDate); 

    days=Math.round((xmas-today)/(1000*60*60*24));

    document.getElementById("date").value = myDate;


    if (days==0) {
    document.getElementById("name2").value = "Today is Christmas!"; 
    }
    if (days<0) {
    document.getElementById("name2").value = "<br>Xmas was " + -1*(days) + " days ago."; 
    }
    if (days>0) {
    document.getElementById("name2").value = "<br>There are " + days + " days to Xmas!";
    }

    </script>

</head>

<body>

    <center>
    <form name="form1">
        <table border=2 width=50% cellspacing=5 cellpadding=8 bgcolor=cyan cols=2>
            <tr>
                <td colspan=2 align=center>
                    When Is Christmas?
                </td>
            </tr>
            <tr>
                <td>
                    Todays Date:
                </td>
                <td>
                    <input name="date" id="name">
                </td>
            </tr>
            <tr>
                <td>
                    Days to Christmas:
                </td>
                <td>
                    <input name="date2" id="name2">
                </td>
            </tr>
        </table>
    </form>
    </center>


</body>
</html>

2 个答案:

答案 0 :(得分:3)

看起来你在这里发生了一些事情。

  1. 您正在寻找具有id日期的元素的值,但不存在任何元素。将<input name="date" id="name">更新为<input name="date" id="date">
  2. 您的代码尝试在页面完全加载之前执行,因此DOM尚未就绪。如果您将脚本部分移到</body>之前,页面就会准备就绪。
  3. 在那之后,您应该能够放弃new Date()而不是“你好”,并且您将开始看到一些进展。

答案 1 :(得分:0)

在您的HTML中,更改

<input name="date" id="name">

<input name="date" id="date">