如何使用 jquery 提交和重定向表单答案

【问题标题】：How can i submit and redirect a form using jquery如何使用 jquery 提交和重定向表单
【发布时间】：2014-05-19 16:31:53
【问题描述】：

我想使用 jquery 提交和重定向表单。我尝试过这样做，但重定向不起作用，这是我的代码。问题是我的表单中有两个提交按钮，当我设置操作 =“.....php”时，它们都重定向到其他页面。但我不希望更新购物车按钮重定向到任何其他页面，所以我想要使用 jquery 提交和重定向表单。请给我一些解决方案。谢谢...

<script type="text/javascript">
 $(document).ready(function(){
     $('#updateCart').click(function(){
    $('#form1').submit(); 
     window.location.href='Checkout.php';

                           });
 });
</script>

<form name="form1" method="post" id="cartform" class="clearfix" action="#">

<input type="submit" id="updateCart" value="Update Cart" class="btn-txt" name="update" onclick="update_cart()"> 
<input type="submit" class="checkout-button btn" name="checkout" />

</form>

【问题讨论】：

标签： javascript jquery forms redirect

【解决方案1】：

您应该在更新购物车按钮上执行e.preventDefault();，然后触发更新购物车的功能。

类似这样的：

<script type="text/javascript">
$(document).ready(function(){
    $('#updateCart').click(function(e){
        e.preventDefault();
        updateCart(); 
    });
});
</script>

您不希望在按下“更新购物车”按钮时触发表单提交，仅在按下“结帐”按钮时。

【讨论】：

【解决方案2】：

您的方法还可以，但您需要确定哪个按钮是您的正式表单“提交”按钮，以及哪个按钮附加到 jQuery 函数以在提交前更新表单。

我建议您不要为主要的“结帐”按钮执行任何 javascript，因为您会希望它转到您捕获付款详细信息的付款页面 - 即表单将遵循它的 action="checkout.php"。

对于您的“更新购物车”按钮，请遵循 APAD1 的答案并根据您的需要进行调整。如果您要更新表单字段，则需要考虑使用 JSON 编码的返回数据...

【讨论】：

【解决方案3】：

您可以通过将其类型设置为“按钮”来使其成为一个不提交的 html 按钮，然后它只会在单击时运行 javascript。然后您可以将 action 属性放回您的表单上，它只会为结帐提交按钮提交。

<button type="button" id="updateCart" class="btn-txt" name="update" onclick="update_cart()">Update Cart</button>

【讨论】：

【解决方案4】：

在表单标签中添加id或类

<form id="form1" ...>

将提交按钮更改为锚点

<a id="submitAnchor"> ... </a>

并在 javascript 中提交表单并重定向用户

$("#submitAnchor").click(function(){
            $(".form1").submit();
            setTimeout(function() {
                window.location = 'your URL';
            }, 1000);
        });

【讨论】：