为了防止在提交表单后刷新页面,我想添加return false; 还有刷新此页面的默认浏览器行为问题。
但是如果我添加return false;或e.preventDefault();任何评论的回复显示只有最后/顶部/新评论重复和刷新后它显示原始评论。不仅删除评论显示加载器持续。
现在我认为我的问题是我的html结构或JavaScript。
index.php的HTML:
<div class="content"><comment>
<div class="post'.$id.'">
//here main comment goes on
</div>
<div class="reply'.$id.'" id="replynext"><ul>
//here reply goes on
</ul></div>
<comment></div>
Reply.php的HTML:
<div class="reply'.$id.'" id="replynext"><ul>
//new reply goes here
</ul></div>
JS回复而不返回false;:
var inputAuthor = $("#author");
var inputComment = $("#comment");
var inputReplycom = $(".replycom");
var inputImg = $("#img");
var inputUrl = $("#url");
var inputTutid = $("#tutid");
var inputparent_id = $("#parent_id");
var commentList = $(".content > comment");
function updateReplybox(){
var tutid = inputTutid.attr("value");
//just for the fade effect
$.ajax({
type: "POST", url: "reply.php", data: "action=update&tutid="+ tutid,
complete: function(data){
var RID = $(this).attr('class').replace('reply','');
$(".reply"+RID).append(data.responseText);
$(".reply"+RID).fadeIn(2000);
}
});
}
//on submit reply
$(".repfrm").click(function(){
error.fadeOut();
var author = inputAuthor.attr("value");
var url = inputUrl.attr("value");
var img = inputImg.attr("value");
var replycom = inputReplycom.attr("value");
var parent_id = inputparent_id.attr("value");
var tutid = inputTutid.attr("value");
$(".loader").fadeIn(400).html('<br><img src="loaders.gif" align="absmiddle"> <span class="loading">Loading Update...</span>');
//send the post to submit.php
$.ajax({
type: "POST",
url: "reply.php",
data: "action=insert&author="+ author + "&replycom="+ replycom + "&url="+ url + "&img="+ img + "&parent_id="+ parent_id + "&tutid="+ tutid,
complete: function(data){
error.fadeOut();
$(".reply"+RID).append(data.responseText);
updateReplybox();
//reactivate the send button
}
});
error_message();
//we prevent the refresh of the page after submitting the form
});