jquery - 使用 jQuery 动态更改表单操作

Question

我的页面上有一个如下所示的表单:

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

根据页面的不同，我想用jQuery动态改变表单的属性；特别是 Action 属性。

$('#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”。为什么？我不知道……我希望有人能解释一下。但我还没有走出困境 - 我有一个输入元素来上传文件。现在，当我尝试使用之前工作的同一表单上传文件时，我点击“提交”，然后它会转到“电子邮件”操作。如果我不尝试上传文件，则会执行“电子邮件会计”操作。

1. 为什么在提交表单后执行 e.preventDefault() 会执行正确的操作？
2. 为什么上传文件会将其定向到原始表单操作；不是 jQuery 修改的吗？

谢谢!

Answer 1

我尝试了如下方法，它对我有用

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