在提交表单时运行 AJAX 代码答案

【问题标题】：Running an AJAX code on the submit of a form在提交表单时运行 AJAX 代码
【发布时间】：2009-12-29 21:24:32
【问题描述】：

这是我的表格：

<form action="/scripts/addemail_fb.php" method="post">
<input type="text" name="email" value="Enter your email here!" />
<input id="submit" type="submit" name="submit" value="Go!" />
</form>

还有我的 jQuery：

    $(document).ready(function() {

        $('form').submit(function() {
            email = $('input[name=email]').val();
            $.post("/scripts/addemail.php", {email_address:email}, function(data){

               if(data == "invalid") { 
                alert("invalid"); 

               } else if(data == "used") { 
                alert("used"); 

               } else if(data == "success") { 
               alert("success"); 

               } else {
                alert("error"); 

               }
            });
        });
    });

还有我的 PHP：

<?php

mysql_connect ('localhost', '********', '********') ;
mysql_select_db ('Blog');

function check_email($input) {

     $input = htmlspecialchars(strip_tags($input));

     $checkaddress = "SELECT * FROM emails WHERE email='$input'"; 
     $query = mysql_query($checkaddress);

     if (!eregi("^([_a-z0-9-]+)(\.[_a-z0-9-]+)*@([a-z0-9-]+)(\.[a-z0-9-]+)*(\.[a-z]{2,4})$", $input)) {
          return "invalid";
     } else if ( mysql_num_rows($query) >= 1 ) { 
        return "used"; 
     } else {
        $result = mysql_query("INSERT INTO emails (email) VALUES ('$input')");
        return "success";
    }
}

$email = urldecode(implode(file('php://input')));
$result = check_email($email);
echo $result;
?>

问题在于它转到了 action="/scripts/addemail_fb.php" 而不是 jQuery。我是 AJAX 和 AJAX 与 jQuery 的新手，但我使用 jQuery 已经有一段时间了。

我认为有两个问题：我认为信息没有正确发送到 jQuery，并且我不确定如何处理 PHP 中的键：值对 (email_address:email)。谢谢你的帮助！是的，我显然是个初学者。

【问题讨论】：

标签： php jquery html ajax email

【解决方案1】：

在表单的提交函数中添加return false; 以防止默认行为。

【讨论】：

【解决方案2】：

考虑将“提交”类型的输入更改为“按钮”。然后将您的 jquery 代码添加到该按钮的“onclick”事件中。所以..而不是 "$('form').submit()..." 你应该使用

$("#nameofSubmitButton").click(function(){
 //do your stuff here.
});

【讨论】：

【解决方案3】：

您需要一个 onSubmit 事件处理程序，或者在表单标记中显式地，或者通过 DOM/jquery 隐式附加到它，指向您的函数。

【讨论】：

【解决方案4】：

您可以将表单操作设置为

<form action='javascript:yourAjaxFunction();'></form>

然后当表单被提交时，它会运行你定义的javascript函数。如果您使用的是 jquery，您可以使用表单的 .serialize 方法将所有变量放入一个查询字符串中，您可以在 ajax 调用中发送该查询字符串。

【讨论】：