如何通过JavaScript提交表单

How to submit forms via JavaScript?

本文关键字：表单 提交 JavaScript 何通过      更新时间：2023-09-26

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

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

我想知道是否有一种方法可以使用.submit()并通过JavaScript传递变量？

Checkout FormData用于没有jQuery:的普通JS解决方案

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);

以下是如何将其与现有表单一起使用的示例：

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变量来跟踪值。然后，您可以使用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>
相关文章：