外部JavaScript文件对表单验证没有响应

时间:2016-03-23 00:21:20

标签: javascript html forms

我正在创建一个链接到外部JavaScript文件的html文件,以验证我的html文件中的表单。每次我在表单上点击“提交”时,页面都会被重新加载,并且不会执行任何JavaScript。我已经尝试过Chrome和Firefox,而且我已禁用弹出窗口阻止以及确保启用JavaScript。

据我所知,到目前为止,我的JavaScript文件没有到达,因为我的JavaScript文件中单个函数的第一行调用alert(),没有弹出窗口或对话框窗口正在出现。

我的HTML,CSS和JavaScript文件都被上传到同一目录,并且html文件成功链接到CSS文件,因为我的样式更改很明显。

为什么不能访问我的JavaScript文件?

HTML:

<!DOCTYPE html>
    <html>
        <head lang="en">
            <meta name="viewport" content="width=device-width" charset="utf-8" />
            <title>TitleLine</title>
            <link rel="stylesheet" href="Style.css"/>
            <script type="text/JavaScript" src="checkTheForm.js" >
            </script>
        </head>
           <body>
                <form name="form1" id="form1" method="post" action="" onsubmit="return validate()">
                        <fieldset>
                            <legend>Survey</legend>

                            <label>Name: </label>
                            <input type="text" name="name" id="name"/>

                            <input type="submit" />
                            <input type="reset" />
                       </fieldset>
                   </form>
               </body>
     </html>

JavaScript的:

function validate()
{
    var myDay = new Date();
    var locMyDay = myDay.toLocaleDateString();

    alert("testing");
    console.log("hi");

    if(document.forms["form1"]["name"].value == "")
    {
        alert("Name field is blank - please enter a name.");
        document.getElementById("name").focus();
        document.getElementById("name").style.backgroundColor = "#FF0000";
        return false;
    }
    else
    {
        document.getElementById("name").style.backgroundColor = "#FFFFFF";
    }

    else
    {
        alert("Form successfully submitted at:  " + locMyDay);
        return true;
    }
}

0 个答案:

没有答案