提交表单而不刷新页面 [英] Submitting a form without refreshing the page
本文介绍了提交表单而不刷新页面的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我遇到了jQuery（或者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-Typecontent =text / html; charset = utf-8/>
< title>无标题文档< / title>
< script type =text / javascriptsrc =jquery.js>< / script>
< script type =text / javascript>
$（＃submit）。click（function（）{
var name = $（＃name）。val（）;
var dataString ='name ='+ name;
$ .ajax（{
type：POST，
url：p.php，
data：dataString，
success：function（）{
alert（It works）;
}）;
return false;
}）;
< / script>
< / head>
< body>
< form id =myFormname =myFormaction =>
< p>
< label for =name>< / label>
< input type =textname =nameid =name/>
< / p>
< p>
< input type =submitname =submitid =submitvalue =Submit/>
< / p>
< / form>
< br />
< / body>
< / html>
处理页面：
<？php include（../ includes / includes.php）; ？>
<？php $ name = $ _POST ['name']; ？>
<？php $ sql =INSERT INTO xyz
（id，value）VALUES
（1，'{$ name}'）;
$ result = $ database-> query（$ sql）;
？>
解决方案
我不知道为什么它不工作，但你可以尝试像这样
< form id =myFormname =myFormaction =>
< p>
< label for =name>< / label>
< input type =textname =nameid =name/>
< / p>
< p>
< input type =buttonname =submitid =submitvalue =Submit/> //将类型更改为按钮
< / p>
< / form>
也会产生错误回调
<$ p $ （函数（e）{
e.preventDefault（）;
var name = $（＃name）。val（）;
$ .ajax（{
type：POST，
url：p.php，
data：{名称：name}，
成功：function（）{
alert（It works）;
}，
error：function（e）{alert（it failed ）;}
}）;
}）;
}）;
I'm having a problem with jQuery(or maybe php). I want forms to be submitted without refreshing the page so i ended up with the following code but the problem is it doesn't work. Here's the code:
<!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>Untitled Document</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$("#submit").click(function() {
var name = $("#name").val();
var dataString = 'name='+ name;
$.ajax({
type: "POST",
url: "p.php",
data: dataString,
success: function(){
alert("It works");
}
});
return false;
});
</script>
</head>
<body>
<form id="myForm" name="myForm" action="">
<p>
<label for="name"></label>
<input type="text" name="name" id="name" />
</p>
<p>
<input type="submit" name="submit" id="submit" value="Submit" />
</p>
</form>
<br />
</body>
</html>
Processing Page:
<?php include("../includes/includes.php"); ?>
<?php $name = $_POST['name']; ?>
<?php $sql = "INSERT INTO xyz
(id, value) VALUES
(1, '{$name}')";
$result = $database->query($sql);
?>
解决方案
i dont know why its not working but you can try like this
<form id="myForm" name="myForm" action="">
<p>
<label for="name"></label>
<input type="text" name="name" id="name" />
</p>
<p>
<input type="button" name="submit" id="submit" value="Submit" />//change type to button
</p>
</form>
also make an error callback
$(function(){
$("#submit").click(function(e) {
e.preventDefault();
var name = $("#name").val();
$.ajax({
type: "POST",
url: "p.php",
data: {name:name},
success: function(){
alert("It works");
},
error:function(e){alert("it failed");}
});
});
});
这篇关于提交表单而不刷新页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
