html - 如何禁用页面重新加载以通过 ajax 发送表单？

Question

我有简单的表单，我想通过 ajax 请求从表单发送数据。我试试这个：

    $('form#station').submit(
            function() {
                console.log('form submit without reloading');
                var coords = station.geometry.getCoordinates();
                 console.log(data);
                $.ajax(
                        {
                            url: '/admin/station/add-ajax',
                            method: 'post',
                            data: {},
                            success: function(result) {
                                console.log('succcess');
                            }
                        }
                );
                return false;
            }
    );

为什么要重新加载页面？

Answer 1

尝试包括 event.preventDefault(); 应该管用。

Answer 2

如果你使用 event.preventDefault(); 您应该通过该函数传递事件对象，因为如果您不这样做，IE 将会出现问题。所以：

$('form#station').submit(function(e){
    e.preventDefault(); // e = event
});

我通常会使用 return false; 您可以将它放在所有其他代码之前，以确保它在 ajax 运行之前停止提交。在实际停止提交之前，它可能只是等待太长时间获取数据。很难确定。