如何通过JavaScript提交表单？

Question

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

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

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

Answer 1

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

有examples如何与现有的形式使用它：

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> 

Answer 2

您可以保留一个隐藏的输入或一个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>