用ajax显示的下拉框，如何获取它的选定值

时间：2021-04-27 18:57:53
我用document.getElementById("select").innerHTML=unescape(request.responseText);
从另一个页面获取到一个下拉框，如何获取到这个下拉框的选定值呢，我的目的是让下拉框选什么值，表单里的文本框也显示相应的值。
假如普通表单的话直接document.getElementById("input").value=document.getElementById("select").value就行了，可是ajax不会了，求高手指教。

8 个解决方案

#1

ajax里面也可以用
document.getElementById("input").value=document.getElementById("select").value就
关键是你找对对象

#2

引用 1 楼 net_lover 的回复:
ajax里面也可以用
document.getElementById("input").value=document.getElementById("select").value就
关键是你找对对象


这个我试过，不管select选啥值，input里的值始终是"undefined“，不对。

#3

document.getElementById("select").value 

select的ID检查一下大小写。

#4

粘代码

#5

只能贴代码了，这个是ajax前台
<script language="javascript">
function get_inf(){
now_time=new Date().getTime();
var url="test.asp?now_time="+now_time+"&bm="+escape(document.getElementById("mdep").value)+"";
  request.open("get", url, true);
request.onreadystatechange = updatePage;
  request.setRequestHeader('Content-type','application/x-www-form-urlencoded');
  request.send(null);  
}


 function updatePage() {
  if (request.readyState == 4) {
  if (request.status == 200) {
document.getElementById("select1").innerHTML=unescape(request.responseText);
document.getElementById("input1").value=document.getElementById("select1").value;
}
  }}

</script>

<body>
<input name="input1" id="input1" type="text" />
<select name="mdep" id="mdep" onchange="javascript:get_inf()">
  <option value=""></option>
  <option value="a">a</option>
  <option value="b">b</option>
</select>   

<div id="select1"></div></body>
</html>


这个是ajax后台 test.asp
<% 数据库连接
bm1=request.QueryString("bm")
if bm1 = "a" then
sql="select distinct x from table"
set rs=server.createobject("adodb.recordset")
rs.open sql,conn,1,1

response.Write "<select size='1' name='uname'>"
do while not rs.eof
response.Write "<option value='"
response.Write escape(rs("x"))
response.Write "'>"
response.Write escape(rs("x"))
rs.movenext
loop  
response.Write "</option></select>"

else
sql="select distinct xx from table"
set rs=server.createobject("adodb.recordset")
rs.open sql,conn,1,1

response.Write "<select size='1' name='uname'>"
do while not rs.eof
response.Write "<option value='"
response.Write escape(rs("xx"))
response.Write "'>"
response.Write escape(rs("xx"))
rs.movenext
loop  
response.Write "</option></select>"
end if
%>
<%
rs.close
set rs=nothing
%>
</body>
</html>


#6

document.getElementById("select1").innerHTML=unescape(request.responseText);
现在这个可以正确被设置内容吗？就是显示了各个选项？

如果可以的话，你是想从中得到被设为选中状态的那一项？ 还是想在设置之后通过手工改变选项的时候得到所选择的项目？ 感觉你说的象是前者，这样的话，实际就是在你设置的innerHTML里查找设为selected的那一项option了，用正则就可以了。但你后台程序有问题，没有设置selected，默认就会取第一项。而且option没有正确闭合（只对最后一项存在闭合）。

如果默认取第一项，用 document.getElementById("select1").value; 不可以，select1是div,不是select。应该用document.getElementById("select1").getElementsByName("uname").value

不过，如果只是取默认那一项的话，似乎根本就没必要返回整个SELECT，只需返回那一项给INPUT就是了。所以还是应该对返回的SELECT设置ONCHANGE事件，在里面对INPUT进行设置，这样每次改变选项就会反应。

楼主说说到底是哪种情况吧。

#7

如果是后者的话，你在ASP里对SELECT增加ONCHANGE事件，调用一个函数即可。
<select name="uname" onchange="theforever(this.value)">

然后在JS里对那个调用的函数进行实现。这样就会调用这个函数了。
function theforever(v){document.getElementById("input1").value=v;}

#8

引用 7 楼 theforever 的回复:
如果是后者的话，你在ASP里对SELECT增加ONCHANGE事件，调用一个函数即可。
<select name="uname" onchange="theforever(this.value)">

然后在JS里对那个调用的函数进行实现。这样就会调用这个函数了。
function theforever(v){document.getElementById("input1").value=……


谢谢大侠，我的意思是后者，是通过手动选择下拉框的值，然后显示到文本框里，这样确实可以了，太感谢了。

#1

ajax里面也可以用
document.getElementById("input").value=document.getElementById("select").value就
关键是你找对对象

#2

引用 1 楼 net_lover 的回复:
ajax里面也可以用
document.getElementById("input").value=document.getElementById("select").value就
关键是你找对对象


这个我试过，不管select选啥值，input里的值始终是"undefined“，不对。

#3

document.getElementById("select").value 

select的ID检查一下大小写。

#4

粘代码

#5

只能贴代码了，这个是ajax前台
<script language="javascript">
function get_inf(){
now_time=new Date().getTime();
var url="test.asp?now_time="+now_time+"&bm="+escape(document.getElementById("mdep").value)+"";
  request.open("get", url, true);
request.onreadystatechange = updatePage;
  request.setRequestHeader('Content-type','application/x-www-form-urlencoded');
  request.send(null);  
}


 function updatePage() {
  if (request.readyState == 4) {
  if (request.status == 200) {
document.getElementById("select1").innerHTML=unescape(request.responseText);
document.getElementById("input1").value=document.getElementById("select1").value;
}
  }}

</script>

<body>
<input name="input1" id="input1" type="text" />
<select name="mdep" id="mdep" onchange="javascript:get_inf()">
  <option value=""></option>
  <option value="a">a</option>
  <option value="b">b</option>
</select>   

<div id="select1"></div></body>
</html>


这个是ajax后台 test.asp
<% 数据库连接
bm1=request.QueryString("bm")
if bm1 = "a" then
sql="select distinct x from table"
set rs=server.createobject("adodb.recordset")
rs.open sql,conn,1,1

response.Write "<select size='1' name='uname'>"
do while not rs.eof
response.Write "<option value='"
response.Write escape(rs("x"))
response.Write "'>"
response.Write escape(rs("x"))
rs.movenext
loop  
response.Write "</option></select>"

else
sql="select distinct xx from table"
set rs=server.createobject("adodb.recordset")
rs.open sql,conn,1,1

response.Write "<select size='1' name='uname'>"
do while not rs.eof
response.Write "<option value='"
response.Write escape(rs("xx"))
response.Write "'>"
response.Write escape(rs("xx"))
rs.movenext
loop  
response.Write "</option></select>"
end if
%>
<%
rs.close
set rs=nothing
%>
</body>
</html>


#6

document.getElementById("select1").innerHTML=unescape(request.responseText);
现在这个可以正确被设置内容吗？就是显示了各个选项？

如果可以的话，你是想从中得到被设为选中状态的那一项？ 还是想在设置之后通过手工改变选项的时候得到所选择的项目？ 感觉你说的象是前者，这样的话，实际就是在你设置的innerHTML里查找设为selected的那一项option了，用正则就可以了。但你后台程序有问题，没有设置selected，默认就会取第一项。而且option没有正确闭合（只对最后一项存在闭合）。

如果默认取第一项，用 document.getElementById("select1").value; 不可以，select1是div,不是select。应该用document.getElementById("select1").getElementsByName("uname").value

不过，如果只是取默认那一项的话，似乎根本就没必要返回整个SELECT，只需返回那一项给INPUT就是了。所以还是应该对返回的SELECT设置ONCHANGE事件，在里面对INPUT进行设置，这样每次改变选项就会反应。

楼主说说到底是哪种情况吧。

#7

如果是后者的话，你在ASP里对SELECT增加ONCHANGE事件，调用一个函数即可。
<select name="uname" onchange="theforever(this.value)">

然后在JS里对那个调用的函数进行实现。这样就会调用这个函数了。
function theforever(v){document.getElementById("input1").value=v;}

#8

引用 7 楼 theforever 的回复:
如果是后者的话，你在ASP里对SELECT增加ONCHANGE事件，调用一个函数即可。
<select name="uname" onchange="theforever(this.value)">

然后在JS里对那个调用的函数进行实现。这样就会调用这个函数了。
function theforever(v){document.getElementById("input1").value=……


谢谢大侠，我的意思是后者，是通过手动选择下拉框的值，然后显示到文本框里，这样确实可以了，太感谢了。
标签：

相关文章