使用 Jquery 验证插件提交 Ajax 表单不起作用

Posted 2023-02-24

【中文标题】使用 Jquery 验证插件提交 Ajax 表单不起作用

【英文标题】：Ajax form submission with Jquery validation plugin is not working

【发布时间】：2015-06-27 09:04:55

【问题描述】：

我正在使用 Jquery 验证插件来验证表单，我需要在提交后显示成功/错误消息而不重新加载页面。 但是每次我提交表单时，页面都会重新加载。此外，即使数据出现在数据库中，“错误”警报也会不断出现。

index.php

<?php
function register()  
    $name = $_POST['name']; 
    $mail = $_POST['email']; 
    $query = "INSERT INTO table_name (name,email) VALUES ('$name','$email')"; 
    $data = mysql_query($query)or die(mysql_error()); 
    echo json_encode($data);

if(isset($_POST['submit'])) 
    register();

?>

javascript 代码：

$("#myform").validate(
   //rules, messages go here

   submitHandler: function(event) 
        $.ajax(
             url: "index.php",
             type: "POST",
             data: $(#myform).serialize(),
             dataType: 'json',
             success: function() 
                   alert("Thank you!");
             ,
             error: function() 
                   alert("Error. Try again please!");
             
        );

        event.preventDefault();
      

);

【问题讨论】：

如果页面重新加载，您的 JS 代码可能不会被触发。可能是JS错误，也可能是页面没有加载jquery等。

$(#myform).serialize() 缺少引号 => $('#myform').serialize()

在函数中返回false

【参考方案1】：

我认为你的问题在这里

 data: $(#myform).serialize()

改成

 data: $(this).serialize()