Jquery改变表单动作答案

【问题标题】：Jquery to change form actionJquery改变表单动作
【发布时间】：2011-03-27 19:05:31
【问题描述】：

我在一个表单中有两个按钮，单击它们时必须调用两个不同的页面。单击 button1 时，必须加载 page1，单击 button2 时，必须加载 page2。我知道如何在 javascript 中执行此操作，但我不知道如何在 jquery 中执行此操作。有人可以帮我吗？

【问题讨论】：

标签： jquery

【解决方案1】：

试试这个：

$('#button1').click(function(){
   $('#formId').attr('action', 'page1');
});


$('#button2').click(function(){
   $('#formId').attr('action', 'page2');
});

【讨论】：

【解决方案2】：

jQuery 只是 JavaScript，不要对它有不同的看法！就像在“普通”JS 中所做的那样，您向按钮添加事件侦听器并更改表单的 action 属性。在 jQuery 中，这看起来像：

$('#button1').click(function(){
   $('#your_form').attr('action', 'http://uri-for-button1.com');
});

此代码与第二个按钮相同，您只需更改按钮的 id 和表单应提交到的 URI。

【讨论】：

【解决方案3】：

在您的点击处理程序中使用jQuery.attr()：

$("#myform").attr('action', 'page1.php');

【讨论】：

【解决方案4】：

请看这个答案：https://stackoverflow.com/a/3863869/2096619

引用Tamlyn:

如果您有任何名为“action”的表单元素，jQuery (1.4.2) 会感到困惑。您可以通过使用 DOM 属性方法或简单地避免使用名为“action”的表单元素来解决此问题。
<form action="foo">
  <button name="action" value="bar">Go</button>
</form>

<script type="text/javascript">
  $('form').attr('action', 'baz'); //this fails silently
  $('form').get(0).setAttribute('action', 'baz'); //this works
</script>

【讨论】：

【解决方案5】：

为了多样性：

var actions = {input1: "action1.php", input2: "action2.php"};
$("#input1, #input2").click(function() {
    $(this).closest("form").attr("action", actions[this.id]);
});

【讨论】：

【解决方案6】：

$('#button1').click(function(){
$('#myform').prop('action', 'page1.php');
});

【讨论】：

【解决方案7】：

要动态改变表单的动作值，你可以试试下面的代码：

下面的代码是，如果您正在打开某个对话框并且在该对话框中您有表单并且您想要更改它的操作。我使用了 Bootstrap 对话框，并在打开该对话框时为表单分配了操作值。

$('#your-dailog-id').on('show.bs.modal', function (event) {
    var link = $(event.relatedTarget);// Link that triggered the modal
    var cURL= link.data('url');// Extract info from data-* attributes
    $("#delUserform").attr("action", cURL);
});

如果您尝试更改常规页面上的表单操作，请使用以下代码

$("#yourElementId").change(function() { 
  var action = <generate_action>;
  $("#formId").attr("action", action);
});

【讨论】：