Php 页面刷新而不是Ajax加载,无需
在表单提交中,我想加载一个div,其中包含一个mysql表的更新列表。我将表单变量发送到php,并将它们发布到mysql表中。同一页显示完整的表格数据。我想将数据加载到与表单相同的div标记中。因此,信息似乎正在表单上方加载 我的JavascriptPhp 页面刷新而不是Ajax加载,无需,php,javascript,jquery,mysql,ajax,Php,Javascript,Jquery,Mysql,Ajax,在表单提交中,我想加载一个div,其中包含一个mysql表的更新列表。我将表单变量发送到php,并将它们发布到mysql表中。同一页显示完整的表格数据。我想将数据加载到与表单相同的div标记中。因此,信息似乎正在表单上方加载 我的Javascript $("#formSubmit").submit(function(){ var name = $("input#name").val(); var comment = $("input#comment").val(); v
$("#formSubmit").submit(function(){
var name = $("input#name").val();
var comment = $("input#comment").val();
var filmnumber = $("input#hidden").val();
var dataString = 'name='+ name + '&comment=' + comment + '&filmnumber=' + filmnumber;
$.ajax({
type: "POST",
url: "comment.php",
data: dataString,
success: function() {
$('#2').load('comment.php');
}
});
我的表格-
<div id="2">
<p>Add a Comment</p>
<form id="formSubmit" method="POST">
<div>
<input type="hidden" name="hidden" id="hidden" value="2">
<label for="name">Your Name</label>
<input type="text" name="name" id="name" />
<label for="body">Comment Body</label>
<textarea name="comment" id="comment" cols="20" rows="5"></textarea>
<input type="submit" id="comment" class="button" value="Submit" />
</form>
</div>
添加评论
你的名字
评论体
它所做的只是刷新页面,而不是将信息加载到div2:S中
感谢您的帮助您需要使用事件对象上的
preventDefault
方法阻止表单重定向页面:
$("#formSubmit").submit(function(e){ // add the event object as an argument to your function
e.preventDefault(); // right here
var name = $("input#name").val();
var comment = $("input#comment").val();
var filmnumber = $("input#hidden").val();
var dataString = 'name='+ name + '&comment=' + comment + '&filmnumber=' + filmnumber;
$.ajax({
type: "POST",
url: "comment.php",
data: dataString,
success: function() {
$('#2').load('comment.php');
}
});
});
在末尾添加一个return false以阻止表单提交。或者,如果您希望更优雅,请使用preventDefault();方法。就我个人而言,尽管我坚持使用return-false,但对于如此简单的事情
$("#formSubmit").submit(function(e){ // add the event object as an argument to your function
var name = $("input#name").val();
var comment = $("input#comment").val();
var filmnumber = $("input#hidden").val();
var dataString = 'name='+ name + '&comment=' + comment + '&filmnumber=' + filmnumber;
$.ajax({
type: "POST",
url: "comment.php",
data: dataString,
success: function() {
$('#2').load('comment.php');
}
});
return false;//right here
}))
return false
将阻止默认值,但它也将停止事件传播。如果在提供的代码末尾使用return false,它将正常工作。然而,您是对的,如果代码的内容比提供的内容更多,这可能会导致问题。但是如果只是阻止表单提交,返回false就可以了。我知道代码可以正常工作,但是如果上面还有其他提交事件,它们就不会被正确触发,因为你阻止了事件的传播。哦,我只是复制了你的,因为它离我键入的位置更近了。它与顶部相同,不是吗?谢谢你的回答,我已经实现了它,但是它仍然不起作用,你有没有机会看看第115行和第153行之间的这一页查看来源:我不知道我是否已将脚本放置在正确的阶段您最好将所有脚本粘贴在页面底部,然后再关闭
标记。如果将脚本直接放置在表单div标记下,则该脚本不会有问题,对吗?