Question

我的页面上有一个表格如下：

<form action="/home/email" enctype="multipart/form-data" id="email-form" method="post">
// form elements
</form>

根据页面的不同，我想用jQuery动态更改表单的属性;特别是动作属性。

$('#send-email').click(function () {
   $('#email-form').attr('action', '@Url.Action("emailaccounting", "home")')
 )};

上面的jQuery成功呈现为：

<form action="/home/emailaccounting" enctype="multipart/form-data" id="email-form" method="post">
// form elements
</form>

因此，当单击打开弹出窗体以发送电子邮件的链接时，我可以更改窗体属性。但是，当我提交表单时，被击中的动作是原始 - “电子邮件”而非“电子邮件帐户”。

我玩了很多，在电子邮件表单的提交点击处理程序上，我添加了以下内容：

  $('.send-email').click(function (e) {
    // The original form action post will be hit without this...
    e.preventDefault();
    $('#email-form').submit();
  };

通过上面的代码片段，可以调用正确的操作 - “emailaccounting”。为什么？我不知道......我希望有人可以解释一下。但我还没有走出困境 - 我有一个输入元素来上传文件。现在，当我尝试在之前工作的同一表单上上传文件时，我点击提交，然后转到“电子邮件”操作。如果我不尝试上传文件，则会触发“电子邮件帐户”操作。

为什么e.preventDefault（）后跟表单提交命中了正确的操作？
为什么上传文件会将其指向原始表单操作;不是jQuery改变了吗？

谢谢！

Answer 1

我在下面试过，它对我有用

$('#send-email').click(function () {
   $('#email-form').attr('action', '/home/emailaccounting')
 )};

Answer 2

尝试这样的事情：

$('#email-form').attr('action', '<%= Url.Action("emailaccounting", "home") %>');

Answer 3

你只是想让动作成为当前页面，不管是什么？如果是这样，您只需使用action=""。

您没有提及您正在测试的浏览器和版本，或者您是否尝试过其他浏览器和版本。它实际上可能是浏览器的错误/安全功能/特性。如果是这种情况，您可以通过简单地通过AJAX发送表单来解决这个问题。在功能上，它没有什么不同，您甚至可以在成功响应后重定向页面，使其行为相同。使用AJAX，您可以明确地控制帖子URL，而无需改变操作。

使用jQuery动态更改表单操作

3 个答案: