📄 0047.htm

📁 ASP教程宝典书籍语言：简体中文书籍类型：网络编程授权方式：免费软件书籍大小： 500 KB
💻 HTM
字号:
<html>

<head>
<title>新时代软件教程:操作系统 主页制作 服务器 设计软件 网络技术 编程语言 文字编辑</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style>
<!--
body, table {font-size: 9pt; font-family: 宋体}
a {text-decoration:none}
a:hover {color: red;text-decoration:underline}
.1  {background-color: rgb(245,245,245)}
-->
</style>
</head>
<p align="center"><script src="../../1.js"></script></a>
    <p align="center"><big><strong>无刷新聊天室技术实现方法</strong></big></p>

<div align="right">---摘自网易</div>

一、统一名词<BR>文字框：显示聊天内容的框架页面<BR>输入框：输入聊天信息的框架页面<BR>刷新框：自刷新获取最新聊天信息的框架页面，该页面不直接显示出来<BR><BR><BR>二、如何实现<BR>实现无刷新，就是要在当前文字框聊天内容后面不断的添加新的聊天信息。<BR>实现的方式是“添加新信息”，而不是“重新刷新”。<BR><BR>三、技术要点<BR>实现像chat.163.com的无闪烁刷新的聊天室要用到的关键代码：<BR>1.自刷新：<BR>&lt;meta http-equiv="refresh" content="2"&gt;<BR>2.向html文件写代码:<BR>&lt;script&gt;<BR>top.frametext.document.write(&quot;text&quot;);<BR>&lt;/script&gt;<BR><BR>四、例子<BR>1.frame.asp页面。最简单的包含三个框架页<BR>文本框frametext.htm;name=frametext<BR>输入框frameinput.asp;<BR>刷新框framerefresh.asp;<BR><BR>2.文本框frametext.htm内容：<BR>最简单的文本内容。略<BR><BR>3.输入框frameinput.asp内容：<BR>略<BR><BR>4.刷新框framefresh.asp内容（关键）<BR>......<BR>&lt;%<BR>'此处用代码获取最新的聊天信息<BR>'最新信息保存在数组ArrRecord()<BR>'OutNum参数纪录是否有新的聊天纪录出现<BR>%&gt;<BR>&lt;html&gt;<BR>&lt;head&gt;<BR>&lt;meta http-equiv="Content-Type" content="text/html; charset=gb2312"&gt;<BR>&lt;meta http-equiv="refresh" content="2"&gt;&lt;!--定时刷新获取最新信息--&gt;<BR>.....<BR>&lt;%<BR>if OutNum&gt;0&nbsp;then&nbsp;'对于用户来讲，如果有新的信息的话，则输出新信息,否则不<BR>输出<BR>&nbsp;&nbsp;&nbsp;response.write&nbsp;&quot;&lt;script language=""javascript""&gt;&quot;<BR>&nbsp;&nbsp;&nbsp;for&nbsp;i&nbsp;=&nbsp;1&nbsp;to&nbsp;outnum&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;<BR>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;response.write&nbsp;&quot;top.frametext.document.write(&quot;&quot;&quot;&amp;&nbsp;ArrRecord(i)&nbsp;&amp;&quot;&quot;&quot;)<BR>;&quot;<BR>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;next<BR>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;response.write&nbsp;&quot;&lt;/script&gt;&quot;<BR>end&nbsp;if&nbsp;<BR>%&gt;<BR>.....<BR><BR>五、相关问题<BR>1.自刷新存在的一个问题是焦点定位问题（也就是自动滚屏的问题）。用户在文<BR>本框看到的都是第一次进入chatroom看到的内容的位置，不会自动滚屏到新信息<BR>的位置，必须滚动滚动栏才可以。<BR>在chat.163.com，它通过用户点选“自动滚屏”的方法来实现。其实就是选择“<BR>自动滚屏”，程序将启用控制文本框滚屏的一个js程序，关键部分为：<BR>function&nbsp;ScrollWindow()<BR>{<BR>.....<BR>this.scroll(0,&nbsp;65000);&nbsp;//将文本框scroll到指定的位置。这里选定(0,65000)<BR>,就是指向最左下角的位置，由于屏幕高度才600不到，所以在一个用户聊天过程<BR>中，几乎永远不可能达到(0,65000)的位置。这样就保证了屏幕永远滚到最底层。<BR><BR>setTimeout('scrollWindow();',200);&nbsp;//循环。否则只滚动一次是没用的<BR>}<BR><BR>2.清屏。如果不清屏，一直开着聊天窗口，文本框文字内容将永无止境的增加。<BR><BR>清屏可以通过reload&nbsp;文本框页面的方法实现。

  </table>
<p align="center"><script src="../../2.js"></script></a>
</body>
</html>
⌨️ 快捷键说明

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