使用jquery在post之前修改post变量

使用 submit() 函数来创建回调。如果函数返回true,则提交表单;如果返回false,则不发布表单。

$('#theForm').submit(function() {
    $("#field1").val(newValue1);
    $("#field2").val(newValue2);
    $(this).append(newFormField);
    return true;
});

等。

高级视图:
当表单以本机方式提交时,它是浏览器执行的最后一个操作,并且在呈现引擎/javascript解释器的作用域之外执行。

任何通过javascript拦截实际post或get请求的尝试都是不可能的,因为这个传统的web请求只发生在浏览器引擎和网络子系统之间。

现代解决方案:
对于web开发人员来说,使用xmlhttprequest提交表单数据正变得越来越流行,xmlhttprequest是一个web浏览器api,它允许javascript intepreter访问浏览器网络子系统。
This is commonly referred to as Ajax

简单但常见的用法如下:

<html>
  <form id="myForm" onsubmit="processForm()">
   <input type="text" name="first_name"/>
   <input type="text" name="last_name"/>
   <input type="submit" value="Submit">
  </form>

  <!--Using jQuery and Ajax-->
  <script type="text/javascript">
    /**
     * Function is responsible for gathering the form input data, 
     * adding additional values to the list, and POSTing it to the
     * server via Ajax.
     */
    function processForm() {
      //Retreive the data from the form:
      var data = $('#myForm').serializeArray();

      //Add in additional data to the original form data:
      data.push(
        {name: 'age',      value: 25},
        {name: 'sex',      value: 'M'},
        {name: 'weight',   value: 200}
      );

      //Submit the form via Ajax POST request:
      $.ajax({
        type: 'POST',
        url:  'myFormProcessor.php',
        data:  data,
        dataType: 'json'
      }).done(function(data) {
        //The code below is executed asynchronously, 
        //meaning that it does not execute until the
        //Ajax request has finished, and the response has been loaded.
        //This code may, and probably will, load *after* any code that
        //that is defined outside of it.
        alert("Thanks for the submission!");
        console.log("Response Data" +data); //Log the server response to console
      });
      alert("Does this alert appear first or second?");
    }
  </script>
</html>

本地方法: 在xmlhttprequest存在之前,一种解决方案是简单地将任何额外的表单数据直接附加到文档中。

使用上面发布的相同表单,jquery append方法可能如下所示:

<html>
  <form action="myFormProcessor.php" method="POST" id="myForm" onsubmit="return processForm()">
    <input type="text" name="first_name"/>
    <input type="text" name="last_name"/>
    <input type="submit" value="Submit">
  </form>

 <script type="text/javascript">
  /**
   * Function is responsible for adding in additional POST values
   * by appending <input> nodes directly into the form.
   * @return bool - Returns true upon completion to submit the form
   */
  function processForm() {
    $('<input>').attr('type', 'hidden').attr('name', 'age').attr('value', 25).appendTo('#myForm');
    $('<input>').attr('type', 'hidden').attr('name', 'sex').attr('value', 'M').appendTo('#myForm');
    $('<input>').attr('type', 'hidden').attr('name', 'weight').attr('value', 200).appendTo('#myForm');

    return true; //Submit the form now 
    //Alternatively you can return false to NOT submit the form.
  }
 </script>
</html>

我认为你不能那样修改post变量。当提交处理程序运行时,没有真正存在的可以添加或修改的表单数据哈希。 我认为您是对的—您可以自己选择$.post()(我建议您这样做)或者将隐藏的输入附加到表单(有您不需要的dom修改开销)。

我已经研究这个问题一天了,我想出了一个很好的解决办法:

可以使用jquery.clone()创建要提交的表单的副本。 然后您可以对副本进行修改,最后提交副本。

将submit()处理程序附加到表单。

$('form#myForm').submit(myPostHandlingFunction);

然后提交/完成你的功能。最简单的方法是在表单中填充几个隐藏的输入,然后返回true,以便在一切正常时允许提交发生。

您可以挂接submit按钮的click事件并在那里进行处理。 对于键/值对,可以尝试隐藏表单元素。

$("#frm").submit(function (e) {
    e.preventDefault();
    form = document.getElementById("frm"); //$("#frm")

    $.each(form.elements, function (i, el) {
        el.name = your_new_name;
        el.value = your_new_value;
        //... //el.type, el.id ...
    });

    form.submit();

    return true;
});