为什么我的 JavaScript 代码没有运行?(表单验证)

这是我的HTML：

<html>
<head>
    <title>Article</title>
    <link rel="stylesheet" href="pop.css" type="text/css" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
    <script type="text/javascript" src="validator.js"></script>
    <div id="comment_form">
        <form method="POST">
            Name:
            <input type="text" name="name" id="name1" onblur="checkname()">
            <br/> Email:
            <input type="text" name="email" id="email1" onblur="checkemail()">
            <br/>
            <br/> Comment:
            <br/>
            <textarea name="comment" id="comment1" cols="50" rows="2" onblur="checkcomment()"></textarea>
            <br/>
            <input type="submit" value="comment" onsubmit="validateform()">
        </form>
</body>
</html>

这是我的JavaScript：

function checkname() {
    alert("Isee ur java script");
    var myName = document.getElementById("name1");
    var pos = myName.value.search(/^[A-Z][a-z] $/);
    if (pos != 0) {
        alert("Please Enter a Valid name. It should not contain numbers.");
        retrun false;
    } else
        return true
}

function checkemail() {
    var myEmail = document.getElementById("email1");
    var pos = myEmail.value.search(/^[a-z]+-?.?_?@[a-z]+.[a-z]+$/);
    if (pos != 0) {
        alert("Please Enter a Valid Email Address. eg. youremail@hotmail.com");
        retrun false;
    } else
        return true
}
function checkcomment() {
    var myComment = document.getElementById("comment1");
    if (myComment == null || myComment == "") {
        alert("Please add a comment.");
        return false;
    }
}
function validateform() {
    if (myName == null || myName == "" || myEmail == null || myEmail == "" || myComment = null || myComment == "") {
        alert("Please fill out all of the fields!");
    }
}

它根本不起作用，即使我尝试在其中一个功能中提醒某些内容，它也不会显示。我还尝试在 validator.js 中添加它，而不是在 HTML 中调用事件，但它仍然不起作用。

document.getElementById("name").onblur = checkname;
document.getElementById("email").onblur = checkemail;
document.getElementById("comment").onblur = checkcomment;

已调试。在JSFiddle中，它仍然无法正常工作，但至少你的JavaScript中不再有错误。在JSBin中尝试：--->http://jsbin.com/vabewefubi/1/edit?html,js,output

    function checkname() {
    alert("Isee ur java script");
    var myName = document.getElementById("name1");
    var pos = myName.value.search(/^[A-Z][a-z] $/);
    if (pos !== 0) { //!== old: !=
        alert("Please Enter a Valid name. It should not contain numbers.");
        return false; //return old: retrun
    } else
        return true; //missing semicolon
}

function checkemail() {
    var myEmail = document.getElementById("email1");
    var pos = myEmail.value.search(/^[a-z]+-?.?_?@[a-z]+.[a-z]+$/);
    if (pos !== 0) { //!== old: !=
        alert("Please Enter a Valid Email Address. eg. youremail@hotmail.com");
        return false; //return old: retrun
    } else
        return true; //missing semicolon
}
function checkcomment() {
    var myComment = document.getElementById("comment1");
    if (myComment === null || myComment === "") { //=== old: ==
        alert("Please add a comment.");
        return false;
    }
}
function validateform() {
    if (myName === null || myName === "" || myEmail === null || myEmail === "" || myComment === null || myComment === "") { //=== old: ==
        alert("Please fill out all of the fields!");
    }
}

与其使用if (myComment == "")不如使用if (myComment.value == "")并且您的代码中有很多错误，您的某些变量是undefined

在浏览器中按 F12 并打开"控制台"选项卡。这将向你显示Javascript中的所有语法错误。

相关内容

最新更新

热门标签：