2015-02-09 80 views
0

我试图在用户选择下拉列表中的选项时获取表单中的所有值。我正在使用Onchange属性,但我不知道如何通过此属性将所有值发送到submitForm()。如何使用Onchange属性获取表单中的所有值

<input type="hidden" name="var1" value="..." /> 
<input type="hidden" name="var2" value="..." /> 
<input type="hidden" name="var3" value="..." /> 

<select name="var4" onchange="submitForm([var1 var2 var3 var4]);return false"> 
<option value="1">Choice 1</option> 
<option value="2">Choice 2</option> 

</select>  

<script> 
    function submitForm(var1, var2, var3, var4) 
    { 
    var OAjax; 
    if (window.XMLHttpRequest) OAjax = new XMLHttpRequest(); 
    else if (window.ActiveXObject) OAjax = new ActiveXObject('Microsoft.XMLHTTP'); 
    OAjax.open('POST',"return.php",true); 
    OAjax.onreadystatechange = function() 
    { 
    if (OAjax.readyState == 4 && OAjax.status==200) 
    { 
     if (document.getElementById) 
     { 
       document.getElementById('msg').innerHTML=''+OAjax.responseText+''; 
     }  
    } 
    } 
    OAjax.setRequestHeader('Content-type','application/x-www-form-urlencoded'); 
    OAjax.send(var1='+var1+'&var2='+var2'&var3='+var3'&var4='+var4);     
    } 
    </script> 

感谢

+0

这其实并不重要。当表单的提交事件被触发时,无论是通过单击提交按钮,还是以其他方式触发提交操作,所有元素都会被提交。 – FlyingGuy 2015-02-09 04:30:28

回答

0

由于没有jQuery的你JS使用的方法,我假设你没有真正使用jQuery。

在这种情况下

<select name="var4" onchange="submitForm();"> 

然后

function submitForm() { 
    //get the input elements by name and then read its value 
    var OAjax, var1 = document.getElementsByName('var1')[0].value, 
     var2 = document.getElementsByName('var2')[0].value, 
     var3 = document.getElementsByName('var3')[0].value, 
     var4 = document.getElementsByName('var4')[0].value; 
    if (window.XMLHttpRequest) OAjax = new XMLHttpRequest(); 
    else if (window.ActiveXObject) OAjax = new ActiveXObject('Microsoft.XMLHTTP'); 
    OAjax.open('POST', "return.php", true); 
    OAjax.onreadystatechange = function() { 
     if (OAjax.readyState == 4 && OAjax.status == 200) { 
      if (document.getElementById) { 
       document.getElementById('msg').innerHTML = '' + OAjax.responseText + ''; 
      } 
     } 
    } 
    OAjax.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); 
    //create a parma string using the input values 
    OAjax.send('var1=' + var1 + '&var2=' + var2 '&var3=' + var3 '&var4=' + var4); 
} 
+0

thx它的工作原理。只是,对于那些后来的人,你忘记了OAjax.send()中的var2和var3之后的字符“+”。然后它运作良好。谢谢 – 2015-02-09 23:05:25

相关问题