javascript - jQuery 提交刷新页面
以下代码旨在执行纯粹的 AJAX POST 请求，但它似乎通过 AJAX 执行 POST 后浏览器会导航到响应。
HTML...
<div id="bin">
<form class="add" method="post" action="/bin/add/">
<p>I'm interested! Save for later.</p>
<input type="hidden" name="product_id" value="23423">
<input type="submit" value="Save">
</form>
<form style="display:none;" class="remove" method="post" action="/bin/remove/">
<p>I changed my mind--I'm not interested.</p>
<input type="hidden" name="product_id" value="23423">
<input type="submit" value="Unsave">
</form>
</div>
jQuery...
$('#bin form').submit(function() {
$.post($(this).attr('action'),{
success: function(data) { $(this).hide().siblings('form').show() },
data: $(this).serialize()
});
return false;
})
据我所理解，return false; 这一行应该意味着无论如何，对 submit 函数的任何调用，点击“Submit”按钮或按下回车键，都将执行我的函数，并且浏览器 不会 导航到 /bin/add 或 /bin/remove。但是出于某种原因，浏览器 确实 在更改页面。
有什么想法我在这里做错了什么吗？谢谢。
答案＃1
可能是你的 JavaScript 出现了错误，因此正在执行默认行为。
尝试在像 Firebug 这样的工具中检查 XHR。
另外，你可以尝试 event.preventDefault()（其中事件回调的第一个参数是 event）。
答案＃2
我打赌这是因为 $ (this)，试试这样……
$('#bin form').submit(function() {
var $this = $(this);
$.post($this.attr('action'), {
success: function(data) {
$this.hide().siblings('form').show()
},
data: $this.serialize()
});
return false;
});