7

我在页面上有很多类似下面的表格。现在我想根据用户单击的提交按钮更改表单操作（当然还有提交表单）

<form action="/shop/products.php" data-ajax="false" method="post">
    <div data-role="fieldcontain">

        <input name="submit" class="obutn" type="submit" value="Order" />
        <input name="submit" class="oEbutn" type="submit" value="Extras" />

    </div>
</form>

我试过了

$(".obtn").click(function() {
    $(this).parent().parent().attr("action", "/shop/products.php");     
});
$(".oEbtn").click(function() {
    $(this).parent().parent().attr("action", "/shop/extras.php");       
});

但表单总是提交给 products.php。你能告诉我有什么问题吗？

4

5 回答 5

8

不要action在表单本身上设置formaction属性，而是考虑在每个单独的input元素上设置属性。

文档：http ://www.w3.org/TR/html-markup/input.submit.html#input.submit.attrs.formaction

<form data-ajax="false" method="post">
    <div data-role="fieldcontain">
        <input formaction="/shop/products.php" 
               name="submit" class="obutn" type="submit" value="Order" />
        <input formaction="/shop/extras.php" 
               name="submit" class="oEbutn" type="submit" value="Extras" />
    </div>
</form>
于 2015-11-19T10:18:16.497 回答
7

有两个错别字：

  • obtn代替obutn
  • oEbtn代替oEbutn

另一个建议是用来closest("form")获取包含单击按钮的表单。

$(".obutn").click(function() {
    $(this).closest("form").attr("action", "/shop/products.php");     
});
$(".oEbutn").click(function() {
    $(this).closest("form").attr("action", "/shop/extras.php");       
});

$("form").on("submit", function () {
    alert($(this).attr("action"));
});

JSFIDDLE

于 2013-07-15T18:51:45.710 回答
2

捕获提交事件并确定单击了哪个按钮。由此，您可以更改表单的操作。

这是有关如何执行此操作的链接。

如何从表单提交事件中获取导致提交的按钮？

于 2013-07-15T18:56:19.137 回答
1

另外，在点击发生之前不要给表单动作，这是多余的。 

<form data-ajax="false" method="post">
   <div data-role="fieldcontain">

        <input name="submit" class="obutn" type="submit" value="Order" />
        <input name="submit" class="oEbutn" type="submit" value="Extras" />

    </div>
</form>
于 2013-07-15T18:57:09.393 回答
0

如果你用开关试试呢？就像是：

<input name="submit" id = "1" class="obutn" type="submit" value="Order" />
<input name="submit" id = "2" class="oEbutn" type="submit" value="Extras" />

然后在 JavaScript 中我们有：

//param: The Id attr of the button that was clicked
function postTo(id){
  switch(id){
   case 1: postProducts();
           break;
   case 2: postExtras();
           break;

   default: //Do something else 

  }
}

只是一个想法。还没有测试过，但也许它可能会有所帮助。但愿如此。

于 2013-07-15T18:58:01.297 回答