ajax表单输入到数据库帖子

Question

我现在尝试了几个小时，无法让它工作

我的 ajax 调用

 $('.button').click( function() {
         var mail = $("#mail_content").val();

         alert(mail);

        $.ajax({  
            type: "POST",  
            url: "process.php",  
            data: "mail="+ mail,  
            success: function(){  
                alert("success");  
            }  
        });
    });

我的进程.php

<?php
//  echo "<pre>";
//  print_r($_POST);
//  echo "</pre>";

include 'config.php';
include 'lib.php';

$db = dbConnect();


$mail = quote_smart($_POST['mail']);

//insert, update, select, delete
$query = "INSERT INTO mail VALUES ('', '$mail')";
$result = insertQuery($query);


 dbClose($db);

echo "entry saved";

?>

我的表格

<div class="email">
            <div class="email_title">GET NOTIFIED FOR THE GRAND OPENING<br /> </div>
            <div id="contact_form">
              <form id="mail" name="mail" action="" method="post" enctype="multipart/form-data">
                <fieldset>
                  <label for="mail" id="email_label">YOUR EMAIL</label>
                  <input type="text" name="mail_content" id="mail_content" size="30" value="" class="text-input" />
                  <input type="submit" name="submit" class="button" id="submit_btn" value="SAVE" />
                </fieldset>
              </form>
            </div>
        </div>

我忽略了什么吗？ 当我将 process.php 代码放在表单中的操作中时它可以工作

Answer 1

我看到的第一件事是，你的.button 是一个提交输入，所以当你点击它时，表单将被提交，而不是 ajax 调用。

把它变成一个按钮

<input type="button" name="submit" class="button" id="submit_btn" value="SAVE" />

Answer 2

只需如下更改您的 ajax 调用...这也解决了使用 enter 提交问题。

 $('#mail').submit( function() {
        var mail = $("#mail_content").val();
        alert(mail);
        $.ajax({  
            type: "POST",  
            url: "process.php",  
            data: "mail="+ mail,  
            success: function(){  
                alert("success");  
            }  
        });
        return false;
    });