Question

我想在提交表单时阻止页面重新加载。该按钮具有以下代码：

<input type="IMAGE" border="0" src="/addToCartIcon.jpg">

此按钮位于表单内：

<form method="POST" name="myform" onsubmit="return BuyProduct(this,'1','0','False');" action="/shop/basket.asp">

到目前为止，我已经尝试过使用“event.preventDefault（）”，但这似乎不起作用。当用户提交表单时，有没有其他方法可以阻止页面重新加载？

Answer 1

在函数退出之前的BuyProduct函数return false中：

return false;

Answer 2

使用jquery submit函数阻止表单提交。

$( "form" ).submit(function( event ) {
  event.preventDefault();
});

使用此表单提交不会发生。如果你想在没有页面加载的情况下做某事，可以使用jquery ajax

Answer 3

最好使用Ajax提交表单。这将阻止页面重新加载。

使用以下语法：

$("#FormID").submit(function(e) { //On submit

    e.preventDefault(); //prevent default form submission

    var form_data = $(this).serialize(); //serialize form data
    var form_url = $(this).attr("action"); //get form action


    $.ajax({
        url: form_url, 
        type: GET/POST,      
        data: form_data,     
        success: function(returnhtml){                          
            $("#result").html(returnhtml); //display result in tag with ID "result"

        }           
    });    

});

提交表单时阻止页面重新加载

3 个答案: