0

我有一个带有两个提交按钮的表单:一个更新购物车中的商品数量,另一个让用户继续结帐。如果购物车中没有物品是“运输”物品,那么我希望用户不能结帐。我仍然希望用户能够更新数量。

最初我使用了这个javascript:

  $('#cartform').submit(function (e) {
    console.log(e)

    if ($('.item.shipping').length > 0) {
      // there are Shipping items in the cart, so proceed
      console.log("OK to checkout")
    } else {
      // there are no Shipping items so display help
      console.log("NO")
      e.preventDefault();
      $('#shipping-calculator-info p').text("Please select shipping destination.")    
    }
  });

我很快意识到这也禁用了更新数量按钮。

我最初的想法是click从我想要处理的按钮中捕获事件,并preventDefault在它上面。不过,这似乎并不能阻止提交的发生。接下来我想也许e,事件,可能有一个指定事件来源的字段——然后我就可以在上面的submit代码中添加一个条件。虽然我无法找到这样的字段(并且我读到了此信息不存在的提示)。

如何防止同一表单上的多个提交按钮之一的默认操作?

4

4 回答 4

1

我看到你现在做了什么,你引用的是表单,而不是按钮。没问题,您只需要使用 jQuery 很棒的选择器来查找提交按钮。这是一个工作示例:

<form id="form1" method="post" action="formDataHandler.php">
<input name='text1' type='text' value='text input'><br />
<input id='subBtn1' type='submit' value='submit 1'><br />
<input id='subBtn2' type='submit' value='submit 2'>
</form>

<script type="text/javascript">
$("#form1").find('input[type=submit]').on('click', function (e) {
alert($(e.target).val());
    if ($(e.target).val() == 'submit 1') { 
    e.preventDefault();
    } else {
        //do something else
    }
});
</script>
于 2013-02-10T01:53:45.633 回答
0

与其附加到表单的提交事件,为什么不附加到实际按钮的单击事件?

这样您就可以为每个按钮提供适当的代码。您可以在结帐按钮的处理程序中使用 JavaScript 提交表单,然后只需从更新按钮更新 DOM。

于 2013-02-10T01:53:59.333 回答
0

你只需要return false;.

$('#cartform').submit(function (e) {
    console.log(e)

    if ($('.item.shipping').length > 0) {
      // there are Shipping items in the cart, so proceed
      console.log("OK to checkout")
    } else {
      // there are no Shipping items so display help
      console.log("NO")
      e.preventDefault();
      $('#shipping-calculator-info p').text("Please select shipping destination.")    
      return false;
    }
});
于 2013-02-10T01:54:00.920 回答
0

您可以使用的快速解决方法是将提交按钮“转换”为简单按钮,然后将您的代码绑定到点击事件,并在适当的时候从点击事件中使用:

$('#cartform').submit();

手动提交表单。

于 2013-02-10T02:00:03.010 回答