使用Javascript获取表单值

get form values with Javascript

本文关键字：表单 获取 Javascript 使用      更新时间：2023-09-26

我有一个JavaScript函数。我需要从表单中获取值并将其发送到另一个页面。通过使用表单的"onclick"属性，我可以发送一个值。但我也需要发送一个文本框值。

这是JavaScript代码：

<script>
function func(str)
{
if (str=="")
  {
  document.getElementById("txtHint").innerHTML="";
  return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","record.asp?q="+str,true);
xmlhttp.send();
}
</script>

这是表格：

<form id="record">
  value:
<select name="blabla">
  <%
  do until rs.eof
  id=rs("JobId")
  name=rs("JobName")
  rs.movenext
  %>
  <option value=<%=id%>><%=name%></option>
  <% loop %>
  </select>
  <label for="iddepartment">&nbsp;&nbsp;department name: </label>
  <input type="text" name="inputname" id="inputid" />
  <input type="button" name="addDepartment" id="addId" value="ADD" onclick="func(<%=id%>)" />
</form>

如您所见，我可以成功地将"id"值发送到record.asp。但我也需要发送用户在文本输入中输入的值。我尝试了几件事，但都没能成功。我应该如何更改JavaScript函数以及如何更改表单？

您将查询字符串添加到url中，如so record.asp?name=value&name=value

此外，我想你想从以下表单中获取值：

document.forms.<form_id>.<field_name>.value

请参阅用值替换asp代码的完整示例

<html>
<head>
<script type="text/javascript">
    function myFunc(str) {
        var blabla = document.forms.record.blabla.value,
            inputname = document.forms.record.inputname.value;
        if (str === undefined || str.length === 0) {
            document.getElementById("txtHint").innerHTML = "";
            return false;
        }
        if (window.XMLHttpRequest) {
            xmlhttp = new XMLHttpRequest();
        }
        else {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                document.getElementById("txtHint").innerHTML = 
                                                        xmlhttp.responseText;
            }
        }
        xmlhttp.open("GET", "record.asp?q=" + str + "&blabla=" 
                      + blabla + "&inputname=" + inputname, true);
        xmlhttp.send();
        return false;
    }
</script>
</head>

这是正文：

<body>
<div id="txtHint"></div>
<form id="record" onsubmit="return myFunc(7);" method="POST" action="#">
    <select name="blabla">
        <option value="1">Foo</option>
        <option value="2">Bar</option>
    </select>
    <label for="iddepartment">&nbsp;&nbsp;department name:</label>
    <input type="text" name="inputname" id="inputid" />
    <input type="submit" name="addDepartment" id="addId" value="ADD" />
</form>
</body>

要通过GET发送多个值，您可以；以凹入。

示例：

我想发送A（45）和B（303）

结果：？A＝45&B=303

相关文章：