Question

我的表单函数是用PHP编写的，期望传递两个变量。我必须使用Javascript提交表单和变量。我知道我可以使用.submit()实际使用JavaScript提交表单，但需要传递给我的表单函数的变量存储在我的JavaScript中的两个变量中。在使用.submit()提交表单时，我无法理解如何传递这些JavaScript变量。

我的一个想法是在我的html表单中添加隐藏字段，并将这些隐藏输入值的值设置为我在JavaScript变量中的值。

我想知道是否有办法使用.submit()并通过JavaScript传递变量？

Answer 1

您可以保留隐藏的输入或javascript变量来跟踪值。然后，您可以使用AJAX向PHP页面提交值：

<input id="name" type="hidden" .....
....


var dataString = 'name='+ name + '&email=' + email + '&phone=' + phone;
  //alert (dataString);return false;
  $.ajax({
    type: "POST",
    url: "yourpage.php",
    data: dataString,
    success: function() {
      //do something
    }
  });

细节：
http://code.tutsplus.com/tutorials/submit-a-form-without-page-refresh-using-jquery--net-59

或者，您只需更新隐藏的输入值并提交表单：

<script type="text/javascript">
function submitform()
{
    document.forms["formID"].submit();
}
</script>
<form id="formID" action="somepage.php">
Search: <input type='hidden' name='email'>
<a href="javascript: submitform()">Submit</a>
</form>

Answer 2

Checkout FormData for a plain vanilla JS solution without jQuery:

var formData = new FormData();

formData.append("username", "Groucho");
formData.append("accountnum", 123456); 

var request = new XMLHttpRequest();
request.open("POST", "http://foo.com/submitform.php");
request.send(formData);

There are examples how to use it with an existing form:

JS:

var docFormElement = document.getElementById('myForm');  
var docFormData = new FormData(docFormElement);  
docFormData.append("product_license","Enterprise");
var xhrObject = new XMLHttpRequest();  
xhrObject.open("POST","postform.cfm");  
xhrObject.send(docFormData);

HTML:

<form id="myForm">  
   <input name="product_name" type="text" value="ColdFusion" />  
   <input name="product_codename" type="text" value="Zeus" />  
</form>

如何通过JavaScript提交表单？

2 个答案: