📄 代码清单3-16.htm
字号:
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'>#011<span
style='mso-spacerun:yes'> </span><span
class=SpellE>var</span> step = 80;<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'>#012<span
style='mso-spacerun:yes'>
</span>function <span class=SpellE>createXMLHttpRequest</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'>#013<span
style='mso-spacerun:yes'>
</span>if (<span class=SpellE>window.ActiveXObject</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'>#014<span
style='mso-spacerun:yes'>
</span><span class=SpellE>xmlHttp</span> = new <span class=SpellE>ActiveXObject</span>("<span
class=SpellE>Microsoft.XMLHTTP</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'>#015<span
style='mso-spacerun:yes'>
</span>}else if(<span class=SpellE>window.XMLHttpRequest</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'>
</span><span class=SpellE>xmlHttp</span> = new <span class=SpellE>XMLHttpRequest</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'>#017<span
style='mso-spacerun:yes'>
</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'>#018<span
style='mso-spacerun:yes'> </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'>
</span><span style='mso-spacerun:yes'> </span><span
style='mso-tab-count:2'> </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'>#020<span
style='mso-spacerun:yes'>
</span>function <span class=SpellE>sendQuery</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'>
</span><span class=SpellE>createXMLHttpRequest</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'>
</span><span class=SpellE>var</span> timestamp = new Date().<span class=SpellE>getTime</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'>#023<span
style='mso-spacerun:yes'>
</span><span class=SpellE>var</span>
url="/ajaxstudy/third/dynamicImageTableServer.jsp?timestamp"+timestamp;<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'>
</span><span class=SpellE>xmlHttp.open</span>("<span class=SpellE>get",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'>#025<span
style='mso-spacerun:yes'>
</span><span class=SpellE>xmlHttp.onreadystatechange</span> = <span
class=SpellE>callBack</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'>#026<span
style='mso-spacerun:yes'> </span><span
class=SpellE>xmlHttp.send</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'>#027<span
style='mso-spacerun:yes'>
</span><span class=SpellE>setTimeout</span>('<span class=SpellE>sendQuery</span>()',5000);<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'> </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'>#029<span style='mso-spacerun:yes'>
</span><span style='mso-spacerun:yes'> </span><span
style='mso-tab-count:2'> </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'>#030<span
style='mso-spacerun:yes'>
</span>function <span class=SpellE>callBack</span>(){<span
style='mso-spacerun:yes'> </span><span style='mso-tab-count:1'> </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'>
</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'>#032<span style='mso-spacerun:yes'>
</span><span
style='mso-spacerun:yes'> </span><span
style='mso-tab-count:1'> </span>if (<span class=SpellE>xmlHttp.status</span>
== 200) { // </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'>#033<span
style='mso-spacerun:yes'> </span><span
style='mso-tab-count:1'> </span><span
style='mso-spacerun:yes'> </span><span class=SpellE>var</span> <span
class=SpellE>getData</span> = <span class=SpellE>xmlHttp.responseText</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'> </span><span
style='mso-tab-count:1'> </span><span
style='mso-spacerun:yes'> </span><span class=SpellE>changeField</span>(<span
class=SpellE>getData</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'>#035<span
style='mso-spacerun:yes'>
</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'>
</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'>#037<span
style='mso-spacerun:yes'>
</span>}<span style='mso-spacerun:yes'> </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'>#038<span style='mso-spacerun:yes'>
</span><span
style='mso-spacerun:yes'> </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'>#039<span
style='mso-spacerun:yes'>
</span>function <span class=SpellE>changeField</span>(<span class=SpellE>getData</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'> </span><span
style='mso-tab-count:1'> </span><span class=SpellE>var</span>
<span class=SpellE>randomFieldId</span> = <span class=SpellE>parseInt</span>(6*<span
class=SpellE>Math.random</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'> </span><span
style='mso-tab-count:1'> </span><span class=SpellE>var</span>
<span class=SpellE>randomField</span> = <span class=SpellE>document.getElementById</span>(<span
class=SpellE>randomFieldId</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'> </span><span
style='mso-spacerun:yes'> </span><span style='mso-tab-count:
1'> </span><span class=SpellE>randomField.value</span>
= <span class=SpellE>getData</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'> </span><span
style='mso-tab-count:1'> </span><span class=SpellE>randomField.style.backgroundColor</span>
= '#ffff00';<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'> </span><span
style='mso-tab-count:1'> </span>fade(<span
class=SpellE>randomFieldId</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'> </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 + -