使用$.ajax请求用PHP处理jQuery表单到MYSQL数据库
问题：如何使用jQuery和$.ajax请求处理表单，以便将数据传递给脚本，脚本将数据写入数据库 问题： 我有一个简单的电子邮件注册表单，处理后，将电子邮件连同当前日期一起添加到MySQL数据库的表中。在不使用jQuery的情况下处理表单可以按预期工作，添加电子邮件和日期。使用jQuery，表单将成功提交并返回成功消息。但是，没有向数据库添加任何数据 如有任何见解，将不胜感激使用$.ajax请求用PHP处理jQuery表单到MYSQL数据库,php,jquery,mysql,forms,Php,Jquery,Mysql,Forms,问题：如何使用jQuery和$.ajax请求处理表单，以便将数据传递给脚本，脚本将数据写入数据库 问题： 我有一个简单的电子邮件注册表单，处理后，将电子邮件连同当前日期一起添加到MySQL数据库的表中。在不使用jQuery的情况下处理表单可以按预期工作，添加电子邮件和日期。使用jQuery，表单将成功提交并返回成功消息。但是，没有向数据库添加任何数据 如有任何见解，将不胜感激 <!-- PROCESS.PHP --> <?php // DB in
<!-- PROCESS.PHP -->
<?php
// DB info
$dbhost = '#';
$dbuser = '#';
$dbpass = '#';
$dbname = '#';
// Open connection to db
$conn = mysql_connect($dbhost, $dbuser, $dbpass) or die ('Error connecting to mysql');
mysql_select_db($dbname);
// Form variables
$email = $_POST['email'];
$submitted = $_POST['submitted'];
// Clean up
function cleanData($str) {
$str = trim($str);
$str = strip_tags($str);
$str = strtolower($str);
return $str;
}
$email = cleanData($email);
$error = "";
if(isset($submitted)) {
if($email == '') {
$error .= '<p class="error">Please enter your email address.</p>' . "\n";
} else if (!eregi("^[A-Z0-9._%-]+@[A-Z0-9._%-]+\.[A-Z]{2,4}$", $email)) {
$error .= '<p class="error">Please enter a valid email address.</p>' . "\n";
}
if(!$error){
echo '<p id="signup-success-nojs">You have successfully subscribed!</p>';
// Add to database
$add_email = "INSERT INTO subscribers (email,date) VALUES ('$email',CURDATE())";
mysql_query($add_email) or die(mysql_error());
}else{
echo $error;
}
}
?>
<!-- SAMPLE.PHP -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Sample</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
// Email Signup
$("form#newsletter").submit(function() {
var dataStr = $("#newsletter").serialize();
alert(dataStr);
$.ajax({
type: "POST",
url: "process.php",
data: dataStr,
success: function(del){
$('form#newsletter').hide();
$('#signup-success').fadeIn();
}
});
return false;
});
});
</script>
<style type="text/css">
#email {
margin-right:2px;
padding:5px;
width:145px;
border-top:1px solid #ccc;
border-left:1px solid #ccc;
border-right:1px solid #eee;
border-bottom:1px solid #eee;
font-size:14px;
color:#9e9e9e;
}
#signup-success {
margin-bottom:20px;
padding-bottom:10px;
background:url(../img/css/divider-dots.gif) repeat-x 0 100%;
display:none;
}
#signup-success p, #signup-success-nojs {
padding:5px;
background:#fff;
border:1px solid #dedede;
text-align:center;
font-weight:bold;
color:#3d7da5;
}
</style>
</head>
<body>
<?php include('process.php'); ?>
<form id="newsletter" class="divider" name="newsletter" method="post" action="">
<fieldset>
<input id="email" type="text" name="email" />
<input id="submit-button" type="image" src="<?php echo $base_url; ?>/assets/img/css/signup.gif" alt=" SIGNUP " />
<input id="submitted" type="hidden" name="submitted" value="true" />
</fieldset>
</form>
<div id="signup-success"><p>You have successfully subscribed!</p></div>
</body>
</html>
如果使用data:dataStr，请使用：
data : {param: value, param2: value2}
这是处理POST请求的正确方法
另外，我建议使用一个表单插件，比如。检查来自process.php文件.echo的响应，删除post值并警告响应，因为要正确编写所有内容，只需将post值发送到process.php即可。
序列化的语法也可以是
jQuery('#newsletter').formSerialize();
再加上一个表单插件，让生活更轻松。我经常把表格发回到同一页。我发送了一个额外的参数（ajax=true），我用它来改变页面返回浏览器的内容，也就是说，我可以通过innerHTML注入一个页面片段。他的方法是最常用的，实际上是表单插件的一种方法，使生活变得更加简单。我经常把表格发回到同一页。我发送了一个额外的参数（ajax=true），我用它来改变页面返回到浏览器的内容，也就是我可以通过innerHTML注入的页面片段。实际上，他的方法是最常用的方法。；）