javascript - jQuery 提交刷新页面

Question

以下代码旨在执行纯 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; 行应该意味着无论如何，对提交函数的任何调用或点击“提交”按钮或回车意味着我的函数将执行，浏览器不会导航到 /bin/add 或 /bin/remove。但出于某种原因，浏览器正在更改页面。

知道我在这里做错了什么吗？谢谢。

Answer 1

可能是您的 JavaScript 失败了，因此正在执行默认行为。

尝试在 Firebug 等工具中检查 XHR。

此外，您可以尝试 event.preventDefault()(您的事件回调的第一个参数是 event)。