Question

    <!DOCTYPE html>

<html>

    <head>

        <script>
            Function kValForm() {
                var n = document.forms["kForm"]["kName"].value;
                var e = document.forms["kForm"]["kEmail"].value;
                var y = document.forms["kForm"]["kYear"].value;
                var m = document.forms["kForm"]["kMonth"].value;
                var d = document.forms["kForm"]["kDay"].value;
                var atSign = e.indexOf("@");
                var dotSign = e.lastIndexOf(".");


                if( n == null || n == " ") {
                    alert("Please fill in your name.");
                    return false;
                }
                if(y == "Year") {
                    alert("Please select a year.");
                    return false;
                }
                if(m == "Month") {
                    alert("Please select a month.");
                    return false;
                }
                if(d == "Day") {
                    alert("Please select a day.");
                    return false;
                }
                if(atSign<1 || dotSign<atSign+2 || dotSign>= e.length) {
                    alert("please enter a VALID email.");
                    return false;
                }
            }
        </script>

    </head>

    <body>

        <form name="kForm" onsubmit="return kValForm()">

            Name: <input type="text" name="kName" placeholder="Khalifa">
            <br/>
            Date of Birth:
            <select name="kYear">

                <option value="Year" selected>Year</option>
                ...
                <option value="1960">1960</option>

            </select>

            <select name="kMonth">

                <option value="Month" selected>Month</option>
                <option value="January">January</option>
                ...
                <option value="December">December</option>

            </select>
            <select name="kDay">

                <option value="Day" selected>Day</option>
                <option value="1">1</option>
                ...
                <option value="31">31</option>

            </select>

            <br/>
            E-mail: <input type="email" name="kEmail" placeholder="Email@Host.com">

            <br/>

            <input type="submit">

        </form>


    </body>

</html>

我正在尝试使用javascript演示表单验证。但问题是剧本没有运行。

为什么脚本不会运行以阻止发送无效表单？

Answer 1

您必须使用function关键字定义函数，该关键字区分大小写。所以不是这个

Function kValForm() { ..

写下面的

function kValForm() {..。

这是working example。

Answer 2

功能区分大小写，因此更改为功能在一个好的实践中，在调用函数后添加分号（）。正确的代码在

之下

<head>

    <script>
        function kValForm() {
        alert("sdsdfsf");
            var n = document.forms["kForm"]["kName"].value;
            var e = document.forms["kForm"]["kEmail"].value;
            var y = document.forms["kForm"]["kYear"].value;
            var m = document.forms["kForm"]["kMonth"].value;
            var d = document.forms["kForm"]["kDay"].value;
            var atSign = e.indexOf("@");
            var dotSign = e.lastIndexOf(".");


            if( n == null || n == " ") {
                alert("Please fill in your name.");
                return false;
            }
            if(y == "Year") {
                alert("Please select a year.");
                return false;
            }
            if(m == "Month") {
                alert("Please select a month.");
                return false;
            }
            if(d == "Day") {
                alert("Please select a day.");
                return false;
            }
            if(atSign<1 || dotSign<atSign+2 || dotSign>= e.length) {
                alert("please enter a VALID email.");
                return false;
            }
        }
    </script>

</head>

<body>

    <form name="kForm" onsubmit="return kValForm();">

        Name: <input type="text" name="kName" placeholder="Khalifa">
        <br/>
        Date of Birth:
        <select name="kYear">

            <option value="Year" selected>Year</option>
            ...
            <option value="1960">1960</option>

        </select>

        <select name="kMonth">

            <option value="Month" selected>Month</option>
            <option value="January">January</option>
            ...
            <option value="December">December</option>

        </select>
        <select name="kDay">

            <option value="Day" selected>Day</option>
            <option value="1">1</option>
            ...
            <option value="31">31</option>

        </select>

        <br/>
        E-mail: <input type="email" name="kEmail" placeholder="Email@Host.com">

        <br/>

        <input type="submit">

    </form>


</body>

Answer 3

将此更改为onsubmit="return kValForm()"：onsubmit=kValForm();

onsubmit没有运行验证脚本

3 个答案: