我正在使用jQuery将表单数据提交到表单动作中的文件中。但是,当我提交表单时,浏览器会重定向到该操作(comment.php)。我不知道为什么这是因为e.preventDefault()
应该停止浏览器的重定向。理想情况下,我希望浏览器不会重定向并保留在当前页面上(index.php)。
jQuery的:
<script type='text/javascript'>
$('document').ready(function(){
$('.commentContainer').load('../writecomment.php');
$('.answerContainer').on('submit', 'form', function(e){
e.preventDefault();
var form = $(this).closest('form');
$.post($(form).attr('action'),
$(form).serialize(),
function() {
$('.commentContainer').load('../writecomment.php');
$('.commentBox').val('');
}
});
});
</script>
HTML表单:
<form method='POST' action='../comment.php'>
//form contents
</form>
答案 0 :(得分:3)
我认为您的selector
和on
方法无法正常运行。试试:$('form').on('submit', function(e) {
您确定已将表单包装在具有类answerContainer
的元素中吗?
然后确保不要使用$.post
使用$.ajax
:
和this
在元素内部,例如。 form
不是第一个选择器.answerContainer
。
$('document').ready(function(){
$('.commentContainer').load('../writecomment.php');
$('.answerContainer').on('submit', 'form', function(event) {
event.preventDefault();
var $form = $(this);
$.ajax({
"url": $form.attr("action"),
"data": $form.serialize(),
"type": $form.attr("method"),
"response": function() {
$('.commentContainer').load('../writecomment.php');
$('.commentBox').val('');
}
});
});
});