Question

我有一个小脚本，我从选择下拉列表中获取值，通过jquery将其传递给php脚本，然后根据该值返回输出并将其显示在同一页面上而不刷新。当我使用以下代码时，它只是重新加载页面。请有人帮忙。

非常感谢

<form name="offerForm" id="offerForm" method="post">
<select id="product_dropdown">
        <option value="Sony">Sony</option>
      </select>
<input type="image" src="GO.png" alt="" width="30" height="30"/>
</form>

<div id="show"></div>



$(function() {  
      $("#offerForm").submit(function() {  
        alert("validate and process form here !");
        $.post('offers.php', $("#offerForm").serialize(), function(data) {
                    $('#show').html(data);
                });
      });  
});

Answer 1

$(function() {  
      $("#offerForm").submit(function() {  
        alert("validate and process form here !");
        $.post('offers.php', $("#offerForm").serialize(), function(data) {
                    $('#show').html(data);
         });
         return false; //You should add return false to prevent the form submit.
      });  
});

Answer 2

添加return false;

$(function() {  
    $("#offerForm").submit(function() {  
        alert("validate and process form here !");
        $.post('offers.php', $("#offerForm").serialize(), function(data) {
                $('#show').html(data);

            });
        return false;
    });  
});

Answer 3

你错过了一个错误的回报;在提交处理程序中。因此，不会阻止您的浏览器自行提交表单。试试这个：

$(function() {  
     $("#offerForm").submit(function() {  
        alert("validate and process form here !");
        $.post('offers.php', $("#offerForm").serialize(), function(data) {
                 $('#show').html(data);
        });
        return false;
     });  
});

Jquery表单提交将不起作用

3 个答案: