問題描述:在做省市聯動實驗時,appendChild加不上子節點,前一行alert(pro.pname);還正常可以顯示省份名稱,請各位大神幫忙看看問題在哪!萬分感謝
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="https://bbs.csdn.net/topics/">
<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="https://bbs.csdn.net/topics/styles.css">
-->
<script type="text/javascript">
function createXMLHttpRequest(){
try{
return new XMLHttpRequest;//適合大部分瀏覽器
}catch(e){
try{
return new ActiveXObject("Msxml2.XMLHTTP");//適合IE6
}catch(e){
try{
return new ActiveXObject("Microsoft.XMLHTTP");//適合IE5.5及以前版本
}catch(e){
alert("what are you nong sha lai!");
throw e;
}
}
}
}
/*
實作內容:1、在頁面加載成功后,訪問ProvinceServlet獲取全部省份,添加到<select id="province">
2、給<select id="province">添加onchange事件監聽
>在選擇發送改變時,洗掉<select id="city">內除第一行以外的資料,
>訪問CityServlet,通過省份的pid獲取相應的全部市,添加到<select id="city">
*/
window.onload = function(){
//AJAX四步,請求ProvinceServlet,得到所有的省份名稱,使用每個省份名稱創建一個<option>元素,
//添加到<select name="province">中
var xmlHttp = createXMLHttpRequest();//獲取xmlHttp物件
//為什么JS里可以用C標簽,因為頁面在服務器發送給客戶端之前已經被服務器轉成HTML了
var url="<c:url value='https://bbs.csdn.net/ProvinceServlet'/>";
xmlHttp.open("GET",url,true);//傳遞請求方式、請求資源路徑、是否異步
xmlHttp.send(null);//發送請求,GET沒有請求體,但得給NULL,不然FIREFIX可能發送給失敗,POST則用來傳遞引數
xmlHttp.onreadystatechange = function(){//設定回應完成監聽器
if(xmlHttp.readyState==4&&xmlHttp.status==200){
//在服務器狀態碼200且xmlHttp狀態為4時執行:
var text = xmlHttp.responseText;//獲取服務器的文本格式背景關系
//eval()得到的是JS物件的陣列
var proArray=eval("("+text+")");
//回圈遍歷每個省份名稱,每個名稱生成一個option物件,添加到<select>中
for(var i=0;i<proArray.length;i++){
var pro = proArray[i];
var optionEle = document.createElement("option");
optionEle.value = pro.pid;
var textNode = document.createTextNode(pro.pname);
alert(pro.pname);
optionEle.appendChild(textNode);
documnet.getElementById("p").appendChild(optionEle);
}
}
};
};
</script>
</head>
<body>
<h1>省市聯動演示頁面</h1>
省:
<select name="province" id="p" onchange="selectChange()">
<option>===請選擇省===</option>
</select>
市:
<select name="city" id="c">
<option>===請選擇市===</option>
</select>
</body>
</html>
uj5u.com熱心網友回復:
documnet.getElementById("p").appendChild(optionEle);改為:
documnet.getElementById("p").append(optionEle);
uj5u.com熱心網友回復:
這個不行的~~
uj5u.com熱心網友回復:
我試了一下,可以的,不過你的代碼document拼錯了,拼成了documnet
轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/118334.html
標籤:JavaScript
上一篇:如何動態加載TTL字體
