javascript中的表单验证（事件处理）_Javascript_Html_Event Handling

javascript中的表单验证（事件处理）

javascript html

javascript中的表单验证（事件处理）,javascript,html,event-handling,Javascript,Html,Event Handling,我已经用html创建了一个表单，我必须用JavaScript验证它。名字和父亲的名字不应该超过20个字符，所以我已经对它们进行了检查，但它们正在工作。这是我的密码 <html> <head> <script type="text/javascript"> function validate() { var firstName=document.f1.firname.value;

我已经用html创建了一个表单，我必须用JavaScript验证它。名字和父亲的名字不应该超过20个字符，所以我已经对它们进行了检查，但它们正在工作。这是我的密码

<html>
    <head>
        <script type="text/javascript">
        function validate()
        {
            var firstName=document.f1.firname.value;
            var fatherName=document.f1.fname.value;
            var address=document.f1.add.value;
            var phoneNumber=document.f1.ph.value;
            var cnic=document.f1.cnic.value;
            var email=document.f1.email.value;
            var cgpa=document.f1.fname.value;
            var sem=document.f1.sem.value;
            var id=document.f1.cid.value;
            if(firstName.length>20)
            {
                alert("Value can't exceed 20");
            }
            if(fatherName.length>20)
            {
                alert("Value can't exceed 20");
            }
        }
        </script>
    </head>
    <body>
    <form name="f1">
        Name : <input type="text",name="firname">  <br>
        Father's Name: <input type="text",name="fname"> <br>
        Address: <input type="text",name="add"> <br>
        Phone No.:<input type="text",name="ph"> <br>
        CNIC:<input type="text",name="cnic"> <br>
        Email:<input type="text",name="email"> <br>
        City :<br> <input type="radio" name="city" value="lhr"> Lahore <br>
        <input type="radio" name="city" value="karachi"> Karachi <br>
        <input type="radio" name="city" value="isl"> Islamabad <br>
        <select name="country">
            <option value="pakistan">Pakistan</option>
            <option value="india">India</option>
            <option value="china">China</option>
        </select> <br>
        Cgpa:<input type="text",name="cgpa"> <br>
        Department:<input type="text",name="dpt"> <br>
        <select name="degree">
            <option value="se">SE</option>
            <option value="cs">CS</option>
            <option value="it">IT</option>
        </select> <br>
        Semester:<input type="text",name="sem"> <br>
        CollegeId:<input type="text",name="cid"> <br>
        <input type="Submit", value="Submit" ,onsubmit="validate()">
    </form>
    </body>


函数验证（）
{
var firstName=document.f1.firname.value；
var fatherName=document.f1.fname.value；
var地址=document.f1.add.value；
var phoneNumber=document.f1.ph.value；
var cnic=document.f1.cnic.value；
var email=document.f1.email.value；
var cgpa=document.f1.fname.value；
var sem=document.f1.sem.value；
var id=document.f1.cid.value；
如果（firstName.length>20）
{
警报（“值不能超过20”）；
}
如果（父名长度>20）
{
警报（“值不能超过20”）；
}
}
名称：

父亲的名字：

地址：

电话号码：

CNIC:

电子邮件：

城市：拉合尔

卡拉奇

伊斯兰堡

巴基斯坦
印度
中国


Cgpa:

部门：

东南方
反恐精英
信息技术


学期：

学院ID:

有什么问题吗？

不要使用逗号分隔HTML属性。应该是：

Name : <input type="text" name="firname">  <br>

HTML中不应该有任何逗号分隔属性，此

应该是

警报弹出窗口，但仍然没有出现。。

Name : <input type="text",name="firname">  <br>

<form name="f1" onsubmit="validate()">