我正在开发简单的 html 程序,它使用 php 脚本将数据插入 MySQL DB。 但每次我按下“保存”按钮时,它都会将我重定向到 php 页面。 我已经创建了 Javascript 文件,但它对我不起作用。 请帮忙
HTML 文件 (index.html)
<html>
<head>
<script src="js/jquery-1.11.0.min.js" type="text/javascript"></script>
<script src="js/my_script.js" type="text/javascript"></script>
</head>
<body>
<form id="myForm" action="demo_insert.php" method="post">
Name : <input type="text" name="name"><br />
Email : <input type="text" name="email"><br />
Domain : <input type="text" name="domain"><br />
Role : <input type="text" name="role"><br />
<button id="sub">Save</button>
</form>
<span id="result"></span>
</body>
</html>
php文件
<?php
$conn = mysql_connect('localhost', 'root', '');
$db = mysql_select_db('test');
$name=$_POST['name'];
$domain=$_POST['domain'];
$email=$_POST['email'];
$role=$_POST['role'];
$sql = "INSERT INTO user20015 VALUES ('$name', '$domain', '$email', '$role')";
if(mysql_query($sql))
echo "Successfully Inserted";
else
echo "Insertion Failed";
?>
my_script.js 文件
$("#sub").click( function() {
$.post( $("#myForm").attr("action"),
$("#myForm :input").serializeArray(),
function(info){ $("#result").html(info);
});
clearInput();
});
$("#myForm").submit( function() {
return false;
});
function clearInput() {
$("#myForm :input").each( function() {
$(this).val('');
});
}
最佳答案
替换
$("#myForm :input").serializeArray(),
与
$("#myForm").serializeArray(),
正如此方法“将一组表单元素编码为名称和值的数组。”
$("#myForm").submit( function(e) {
/* prevent default form submission */
e.preventDefault();
var form = $(this);
$.post(form.attr("action"), form.serializeArray(), function(info){
$("#result").html(info);
/* reset form fields to defaults */
form.reset();
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<form id="myForm" action="demo_insert.php" method="post">
Name : <input type="text" name="name"><br />
Email : <input type="text" name="email"><br />
Domain : <input type="text" name="domain"><br />
Role : <input type="text" name="role"><br />
<button type="submit" id="sub">Save</button>
</form>
<span id="result"></span>
关于javascript - JQUERY + PHP + AJAX 不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35986054/