在表单提交按钮的点击事件中调用函数时发生引用错误

Reference Error when I call a function on click event for form Submit button

本文关键字：函数 错误 引用 调用 按钮 表单提交 事件      更新时间：2023-09-26

我试图向服务器提交一个表单，但它必须首先由函数验证。然而，即使我声明了函数，我仍然会得到一个引用错误。此外，当我单击按钮时，它将始终提交，即使我没有向按钮添加click属性。

<html id="website" class="no-js" lang="">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <style>
        body {
            padding-top: 50px;
            padding-bottom: 20px;
        }
    </style>
    <link rel="stylesheet" href="css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="css/main.css">
    <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.11.2.min.js"><'/script>')</script>
    <script src="js/vendor/modernizr-2.8.3-respond-1.4.2.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <script src="js/vendor/bootstrap.min.js"></script>
    <script src="js/plugins.js"></script>        
    <script src="js/main.js"></script>
    <script>
        jQuery(document).ready(function($){
            var onlineStatus = true;
            var formObjects = null;
            //Local Storage or Send to Server
            function save(){
                if(onlineStatus == false){
                    formObjects = $('#form').serializeObject();
                    alert("saving to local: " + formObjects);
                    alert(formObjects.length);
                } else{
                    alert("submitting!!");
                    $("#form").submit();
                }
            }
        });             
    </script>
</head>
<body>
<form id="form" role="form" method="post" action="https://www.webserver.com/echo.php">
<div id="form1" class="container">
    <h1>Personal Information</h1>
       <div class="form-group">
          <label for="name">Name</label>
          <input id="name" name="name" type="text" required
             placeholder="Enter Name">
       </div>
       <div class="form-group">
          <label for="email">E-mail:</label>
          <input id="email" name="email" type="email" required
             placeholder="E-mail">
       </div>
   <button id="submitButton" class="btn btn-default" onclick="save();return false;" >Submit</button>
</div> 
</form>  
</body>

范围就是一切！save函数是在.ready方法内部定义的，因此它只能在那里访问。您必须在该范围之外声明此函数：

var onlineStatus = true;
var formObjects = null;
//Local Storage or Send to Server
function save(){
//stuff here
}
jQuery(document).ready(function($){
相关文章：