用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=……


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