静态页面无刷新添加回复,实时更新静态网页

原创 2007年09月11日 18:37:00
 

静态页面无刷新添加回复,实时更新静态网页 ,不用xml,我用另一种办法实现

适用:带回复/评论的文章页面(.html,.htm格式).

演示页面:  http://www.uptoday.cn/shtml/article1537.htm

所用技术:AJAX   fso文件操作

原理:在静态页内发表回复,由ajax后台处理回复内容,并回调给前台显示(无刷新)。同时在后台用fso重写此静态页面(服务器上),将回复内容写入。因为前台浏览器上的静态页已下载到客户端,不会受到影响,但一刷新,就是更新后的页面了.

关键代码:

*********前台 article23.htm***********

<HTML>
<SCRIPT LANGUAGE="JavaScript">
function ajax_reply(name,comment,id){

      var xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");     
      xmlhttp.open("POST","reply_submit.asp",true);
      xmlhttp.setRequestHeader('Content-type','application/x-www-form-urlencoded');
   xmlhttp.onreadystatechange=function(){
   if (xmlhttp.readystate==1)
        {}
         else if(xmlhttp.readystate==4)
   {
   window.alert("感谢您的回复!/n若发现楼数不对,请刷新!");
   document.getElementById("reply").innerHTML+=xmlhttp.responseText; //前台显示新回复
   }
}
   xmlhttp.send("name="+escape(name)+"&comment="+escape(comment)+"&id="+escape(id));
}

}

</SCRIPT>
<BODY>
   <div id="title">文章标题</div>
   <div id="content">文章内容</div>

<div id="reply">回复内容
    <span>用户名1</span><BR><div>回复1</div>
    <reply/>   <!-- 标记,新回复将出现的位置 -->
</div>

<div id="reply_form" >添加回复的表单
     <FORM METHOD=POST ACTION="">
   <INPUT TYPE="text" NAME="name"><TEXTAREA NAME="comment" ROWS="" COLS=""></TEXTAREA>
   <INPUT TYPE="bottom" value="提交" onclick="ajax_reply(name.value,comment.value,23)">
     </FORM>
</div>


</BODY>
</HTML>

********后台处理 reply_submit.asp*****

<%
reply="<span>"&Request.Form("name")&"</span><BR><div>"&Request.Form("comment")&"</div>"

b=server.mappath("/")
id=Request.Form("id")

'此处也可向数据库中添加记录
Set fso=Server.CreateObject("Scripting.FileSystemObject")

Set type1=fso.openTextFile(b&"/article"&id&".htm")
   all=type1.readall
   all=replace(all,"<reply/>",reply&"<reply/>")   '处理原页面,加入新回复

Set type2=fso.createTextFile(b&"/article"&id&".htm")
type2.WriteLine all   '重写页面
type2.close
Set fso=Nothing

response.write reply   '回调给前台
%>
***********************************
演示页面:  http://www.uptoday.cn/shtml/article1537.htm
在此页底部回复,暂不支持firefox

网站性能优化,使用velocity实现页面静态化,实现实时更新静态页面

使用velocity实现页面静态化可以提高网站的
  • dengwenwei121
  • dengwenwei121
  • 2014年11月19日 16:45
  • 2808

静态页面html局部更新数据(ssl局部更新)

apache SHTML网页SSI使用详解 Apache支持include文件解析shtml首先要应该修改Apache配置文件httpd.conf 1. 确认加载include.so模块,将注释去掉:...
  • lba8610
  • lba8610
  • 2014年08月23日 17:33
  • 791

如何实现前端页面的数字自动刷新

页面刷新获取多条格式相同的数据
  • xkhgnc_6666
  • xkhgnc_6666
  • 2016年06月22日 09:58
  • 1785

制作手机静态页面

1.引入库(百度cdn): 引入bootstrap 引入jquery  2.手机适应屏幕: body { margin:0px;  height: 100%;  width: 100% ...
  • qwbtc
  • qwbtc
  • 2016年05月03日 10:13
  • 1194

php 文章生成静态页面并设定时间更新

php 文章生成静态页面并设定时间更新
  • sinat_22319877
  • sinat_22319877
  • 2015年08月30日 02:25
  • 793

静态网页与动态网页的差异

静态网页:       是指在动态网页技术产生之前,用纯HTML代码编写的网页,并保存为*.html或*.htm的文件形式。       它可以包含HTML标记、文本、Jave小程序、客户端脚本以...
  • u012581322
  • u012581322
  • 2015年07月16日 20:17
  • 1154

为什么要让网页静态化,生成静态的程序来做网站的好处?

如今不少客户在QQ上咨询我们,网站生成静态HTML有什么好处,现在归纳直来一并答复为什么让网页”静”下来,生成静态HTML有什么好处呢?      我们的回答:      在三年前,有百分之八十的...
  • wuming__
  • wuming__
  • 2015年01月20日 16:50
  • 1351

c# 网站生成静态页面

private ArrayList htmlCreatedList = new ArrayList(); /// /// 递归实现页面静态化功能 /...
  • chenqiangdage
  • chenqiangdage
  • 2015年11月16日 11:06
  • 2366

阿里云快速搭建一个静态网站

前言:作为一个初级程序员,都梦想着自己能搭建一个自己的个人网站,同时展示给其他人浏览。如果你刚开始接触可看一下,我建议先给自己的静态网站发布到服务器上去。准备:1、申请注册一个服务器申请注册一个云服务...
  • Ink4T
  • Ink4T
  • 2017年12月08日 17:56
  • 1351

个人小作品之某公司首页静态页面的制作

学习了一段时间的html、css自己来制作个静态网页玩玩。
  • h15882065951
  • h15882065951
  • 2017年03月17日 20:03
  • 352
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:静态页面无刷新添加回复,实时更新静态网页
举报原因:
原因补充:

(最多只允许输入30个字)