问在表单提交过程中不调用JavaScript函数
EN

Stack Overflow用户

提问于 2017-01-21 07:09:22

回答 1查看 44关注 0票数 1

当我单击注册表单中的submit按钮时，不会调用JavaScript函数，但当我尝试在线编辑器时，它的工作正常，但在我的Pycharm中，它与火狐浏览器无关。当我提交表单时，它会在输入字段未填充时提交，输入字段可以通过JavaScript函数'emp_details‘找到，但不会发生。

My signup.html


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Employee Details</title>
    <script type="text/javascript">
    function emp_details(){
        var id = document.forms["form2"]['id'].value;
        var fname = document.forms["form2"]["fname"].value;
        var lname = document.forms["form2"]["lname"].value;


        var Password = document.forms["form2"]['password'].value;

        var designation = document.forms["form2"]['designation'].value;
        var experience = document.forms["form2"]['experience'].value;
        window.alert("fname");
        var alphaExp = /^[a-zA-Z]+$/;
        var pass = /^[a-zA-Z0-9@$#]{8,15}$/;
        if(!id ||!fname  || !lname ||!Password ||!designation ||!experience)
        {
            alert("Please enter all the fields");
            return false;
        }
        else
        {
        if(!isNaN(id))
        {
        if(fname.match(alphaExp))
        {
            if(lname.match(alphaExp))
            {

                    if(Password.match(pass))
                    {
                     /*var values = Sijax.getFormValues("#form2");
                     alert(values);
                    Sijax.request('submit',[values]);*/
                     return true;
                    }


                else
                {alert("Enter a valid password ");
                return false;
                }
            }
            else
            {
            alert("Enter a valid last name");
            return false;
            }
            }
        else
        {
         alert("Enter a valid first name");
         return false;
         }
         }
         else
         {
         alert("ID must be in Numbers");
         return false;
         }
    }
}
    </script>

    <style>
        label {
  display: inline-block;
  width: 140px;
  text-align: right;
}
label,input,select{
margin-left:40px;
}
    </style>
</head>
<body style="font-family: Liberation Sans">
 <div style="padding-left:5%;padding-top:0.2%;height:1%;width:100%;background-color:#11557c">
    <h2>Welcome to my site</h2><br>
    </div>
<div style="margin-left:15%" >
<form name="form2" id="form2" method="post" action = "http://127.0.0.1:2908/signup" >

<br><br><br>
<label id = "id">ID</label> <input type="text" name = "id" placeholder = "ID" style = "padding-left: 0.2%;"><br><br>
    <label id = "fname">First Name</label> <input type="text" name = "fname" placeholder = "First Name" style = "padding-left: 0.2%;"><br><br>
    <label id = "lname">Last Name</label> <input type="text" name = "lname" placeholder = "Last Name" style = "padding-left: 0.2%;"><br><br>
    <label id = "password">Password</label>
    <input type="password" name = "password" placeholder = "Password" style = "padding-left: 0.2%;"><br><br>
<label id = "department">Department</label>
    <select name="department">
        <option value="Ecategory"> Category </option>
        <option value="Developer Team"> Developer Team</option>
        <option value="Testing Team"> Testing Team</option>
        <option value="Network Team"> Network Team</option>
        <option value="Server Maintance Team"> Server Maintance Team</option>
    </select><br><br>
    <label id = "designation">Designation</label>
    <input type="text" name = "designation" placeholder = "Designation" style = "padding-left: 0.2%;"><br><br>
    <label id = "experience">Experience</label>
    <input type="text" name = "experience" placeholder = "Experience" style = "padding-left: 0.2%;"><br><br>

    <label id = "emp_type">Admin</label>
    <input type="radio" id = "r1" value="Yes" name="emp_type" ><span>Yes</span>
    <input type="radio" id = " r2" value="No" name="emp_type"checked="checked"><span>No</span>
    <br><br><br>

    <input type="submit" value="Submit" onsubmit="return emp_details()" style="font-size:15pt;color:white;background-color: #3f51b5;border:2px solid ;padding:7px;padding-left:100px;padding-right:100px">
    </form></div>
</body>

</html>

javascript

html

回答 1

Stack Overflow用户

回答已采纳

发布于 2017-01-21 07:17:56

onsubmit属性应该在form标记上，而不是在提交按钮上。引用自MDN

提交事件是在提交表单时触发的。注意，submit只在form元素上触发，而不是在button或submit input上触发。(表单是提交的，而不是按钮。)

<form name="form2" id="form2" method="post" action="http://127.0.0.1:2908/signup" 
      onsubmit="return emp_details()">

    <!--- .... --->

    <input type="submit" value="Submit">
</form>

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/41776678

复制

相似问题

问在表单提交过程中不调用JavaScript函数
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在表单提交过程中不调用JavaScript函数EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在表单提交过程中不调用JavaScript函数
EN