⭐ 欢迎来到虫虫下载站! | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站

📄 代码清单3-6.htm

📁 《深入浅出Ajax》 源代码
💻 HTM
📖 第 1 页 / 共 3 页
字号:

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#014<span style='mso-spacerun:yes'>&nbsp;
</span><span style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>//</span><span
style='font-size:9.0pt;font-family:宋体;mso-ascii-font-family:"Times New Roman";
mso-hansi-font-family:"Times New Roman"'>根据点击的部门节点请求数据</span><span lang=EN-US
style='font-size:9.0pt'><o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#015<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span>function <span
class=SpellE><span class=GramE>getMembers</span></span><span class=GramE>(</span>depart){<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp; </span><span style='mso-tab-count:
1'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#016<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
style='mso-tab-count:1'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
class=GramE>if(</span>depart!=&quot;null&quot;){<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#017<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
style='mso-tab-count:2'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
class=SpellE>dep</span> = depart;<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#018<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
style='mso-tab-count:1'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
class=SpellE><span class=GramE>createXMLHttpRequest</span></span><span
class=GramE>(</span>);<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#019<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
style='mso-tab-count:1'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
class=SpellE>var</span> <span class=SpellE><span class=GramE>url</span></span>=&quot;/<span
class=SpellE>ajaxstudy/third/dropDownListServer.jsp?depart</span>=&quot;+depart;<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#020<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
style='mso-tab-count:1'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
class=SpellE><span class=GramE>xmlHttp.open</span></span><span class=GramE>(</span>&quot;<span
class=SpellE>GET&quot;,url,true</span>);<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#021<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
style='mso-tab-count:1'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
class=SpellE>xmlHttp.onreadystatechange</span> = <span class=SpellE>showMembers</span>;<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#022<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
style='mso-tab-count:1'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
class=SpellE><span class=GramE>xmlHttp.send</span></span><span class=GramE>(</span>null);<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#023<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span>}<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#024<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span>}<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#025<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span>function <span
class=SpellE><span class=GramE>hideMenu</span></span><span class=GramE>(</span>depart){<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#026<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
style='mso-tab-count:1'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
class=GramE>if(</span><span class=SpellE>document.getElementById</span>(<span
class=SpellE>dep</span>).<span class=SpellE>parentNode.style.display</span>=='none'){<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#027<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp; </span><span
style='mso-spacerun:yes'>&nbsp;&nbsp;</span><span style='mso-tab-count:2'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
class=SpellE><span class=GramE>document.getElementById</span></span><span
class=GramE>(</span><span class=SpellE>dep</span>).<span class=SpellE>parentNode.style.display</span>='block';<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#028<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
style='mso-tab-count:1'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span>}
else <span class=GramE>if(</span><span class=SpellE>document.getElementById</span>(<span
class=SpellE>dep</span>).<span class=SpellE>parentNode.style.display</span>='block'){<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#029<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
style='mso-tab-count:2'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
class=SpellE><span class=GramE>document.getElementById</span></span><span
class=GramE>(</span><span class=SpellE>dep</span>).<span class=SpellE>parentNode.style.display</span>='none';<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#030<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
style='mso-tab-count:2'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
class=SpellE><span class=GramE>document.getElementById</span></span><span
class=GramE>(</span><span class=SpellE>dep</span>).<span class=SpellE>innerHTML</span>='&amp;<span
class=SpellE>nbsp</span>;';<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#031<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
style='mso-tab-count:2'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
class=GramE>return</span> null;<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#032<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
style='mso-tab-count:1'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span>}<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#033<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span>}<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#034<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span>//</span><span
style='font-size:9.0pt;font-family:宋体;mso-ascii-font-family:"Times New Roman";
mso-hansi-font-family:"Times New Roman"'>将返回的数据显示在点击的节点下</span><span
lang=EN-US style='font-size:9.0pt'><o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#035<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span>function <span
class=SpellE><span class=GramE>showMembers</span></span><span class=GramE>(</span>){<span
style='mso-spacerun:yes'>&nbsp; </span><span style='mso-tab-count:1'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#036<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
style='mso-tab-count:1'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span>if
(<span class=SpellE>xmlHttp.readyState</span> == 4) { <o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#037<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
style='mso-tab-count:3'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span>if
(<span class=SpellE>xmlHttp.status</span> == 200) {<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#038<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
class=SpellE>var</span> <span class=SpellE>membersData</span> = <span
class=SpellE><span class=GramE>xmlHttp.responseXML.getElementsByTagName</span></span><span
class=GramE>(</span>'member');<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
</span><o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#039<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
class=SpellE>var</span> <span class=SpellE>mdisplay</span> = '';<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#040<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
class=GramE>for(</span><span class=SpellE>var</span> <span class=SpellE>i</span>=0;i&lt;<span
class=SpellE>membersData.length;i</span>++){<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#041<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
style='mso-tab-count:1'>&nbsp;&nbsp;&nbsp;&nbsp; </span><span class=SpellE>mdisplay</span>
+= '&amp;<span class=SpellE>nbsp<span class=GramE>;&amp;</span>nbsp;&amp;nbsp</span>;';<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#042<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
style='mso-tab-count:1'>&nbsp;&nbsp;&nbsp;&nbsp; </span><span class=SpellE>mdisplay</span>
+= <span class=SpellE>membersData</span>[<span class=SpellE>i</span>].<span
class=SpellE><span class=GramE>childNodes</span></span><span class=GramE>[</span>1].<span
class=SpellE>firstChild.nodeValue</span>;<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#043<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
style='mso-tab-count:1'>&nbsp;&nbsp;&nbsp;&nbsp; </span><span class=SpellE>mdisplay</span>
+= '&lt;<span class=SpellE>br</span>&gt;';<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#044<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span>}<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#045<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
class=SpellE><span class=GramE>document.getElementById</span></span><span
class=GramE>(</span><span class=SpellE>dep</span>).<span class=SpellE>parentNode.style.display</span>='block';<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#046<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span><span
class=SpellE><span class=GramE>document.getElementById</span></span><span
class=GramE>(</span><span class=SpellE>dep</span>).<span class=SpellE>innerHTML</span>=<span
class=SpellE>mdisplay</span>;<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#047<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; </span>}<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#048<span
style='mso-spacerun:yes'>&nbsp;&nbsp;&nbsp; </span>}<o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span
lang=EN-US style='font-size:9.0pt'>#<span class=GramE>049<span
style='mso-spacerun:yes'>&nbsp; </span>}</span><o:p></o:p></span></p>

<p class=MsoNormal style='text-indent:18.0pt;background:#E6E6E6'><span

⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -