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

我敢打赌这是因为$(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;
});

演示 _没有错误

演示 _有错误