Ajax下拉菜单的问题 好像永远都解决不了 - Web 开发 / Ajax
<%@ page contentType="text/plain;charset=utf-8" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>BookInfo.htm</title> <script language="JavaScript"> var xmlHttp; function createXMLHttpRequest() { if (window.XMLHttpRequest) { xmlHttp = new XMLHttpRequest(); } else { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } } //获取数据的调用函数 function Query() { var value = myform.users.value; alert(value); createXMLHttpRequest(); xmlHttp.onreadystatechange = getData; xmlHttp.open("GET","SearchBook.jsp?value="+value,true); xmlHttp.send(null); } //回调函数 function getData() { if(xmlHttp.readyState == 4 && xmlHttp.status==200) { document.getElementById('bookinfo').innerHTML = xmlHttp.responseText; } } </script> </head> <body> <h1>实验三下拉菜单示例</h1> <form action="myform"> 选择图书编号: <select name="users" onchange="Query()"> <option value="1"> 1程序设计 </option> <option value="2"> 2网络维护 </option> <option value="3"> 3多媒体设计 </option> </select> </form> <div id="bookinfo"> </div> </body></html>
<%@ page contentType="text/plain;charset=UTF-8"%><%@ page language="java"%><% out.clear();//清空当前的输出内容(空格和换行符) String valueStr = request.getParameter("value"); String bookinfo = null;//用于保存详细信息 if (valueStr != null) { if("1".equals(valueStr)) { bookinfo = "bookinfo详细信息1:我是xxxxx!!!!!!!"; } else if("2".equals(valueStr)) { bookinfo = "bookinfo详细信息2:欢迎进入我的空间!!!!"; } else { bookinfo = "bookinfo详细信息3:成功感言!!!!!!!!"; } } //根据是否包含正确内容决定输出的信息 if (null != bookinfo) { out.println(bookinfo); } else { out.println("无法或者book详细信息"); }%>
function display()//这里就可以获取啊
{
var index=document.myform.myselect.selectedIndex;
alert(index);
alert(document.myform.myselect.options[index].value);
}
</script>
</head>
<body>
<h1> 搜索真正的房产信息表 </h1>
<form action= "# " name= "myform ">
Show listings from
<select name=myselect onchange= "display() ">
<option value= "5000 "> $50,000 </option>
<option value= "100000 "> $100,000 </option>
<option value= "150000 "> $150,000 </option>
</select>
to
<select>
<option value= "100000 "> $100,000 </option>
<option value= "150000 "> $150,000 </option>
<option value= "200000 "> $200,000 </option>
</select>
<input type= "button " value= "搜索 " onclick= "startRequest() " />
</form>
<span id= "header ">
</span>
<table id= "resultTable " width= "75% " border= "0 " >
<tbody id= "resultBody ">
</tbody>
</table>
</body>
</html>
获取的是value 并非TEXT
[解决办法]
function Query(value) { var value = myform.users.value; alert(value); createXMLHttpRequest(); xmlHttp.onreadystatechange = getData; xmlHttp.open("GET","SearchBook.jsp?value="+value,true); xmlHttp.send(null); } <select name="users" onchange="Query(this.value)"> 就可以得到值了