文档章节

原生态Ajax无刷新评论和顶踩代码(记事本打造,无验证)

 木宛城主
发布于 2015/03/02 19:39
字数 515
阅读 6
收藏 0
点赞 0
评论 0

<script type="text/javascript">
var xhr=false;
	var actionType;
	//todo:
	var sId=1;
  function createXmlHttp() {//创建xhr对象
            var xhobj = false;
            try {
                xhobj = new ActiveXObject("Msxml2.XMLHTTP"); // ie msxml3.0+
            } catch (e) {
                try {
                    xhobj = new ActiveXObject("Microsoft.XMLHTTP"); //ie msxml2.6
                } catch (e2) {
                    xhobj = false;
                }
            }
            if (!xhobj && typeof XMLHttpRequest != 'undefined') {// Firefox, Opera 8.0+, Safari
                xhobj = new XMLHttpRequest();
            }
            return xhobj;
        }
	window.onload=function(){
		xhr=new createXmlHttp();
	}
	function doSupport(isSupport){
		xhr.open("POST","DoSupport.ashx",true);
		xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
		xhr.onreadystatechange=watching;
		if(isSupport){
			actionType=1;
			xhr.send("sId="+sId+"&isSup="+actionType);
		}
		else{
			actionType=0;
			xhr.send("sId="+sId+"&isSup="+actionType);
		}	
	}
	function watching(){
		if(xhr.readyState>=4){
			if(xhr.status==200){
				var resText=xhr.responseText;
				var resArr=resText.split(",");
				if(resArr[0]=="ok"){
					if(actionType==1){
						document.getElementById("spanSup").innerHtml=resArr[1];
					}
					else{
						document.getElementById("spanDisSup").innerHtml=resArr[1];
					}
				}
				else{
					//todo:
				}	
			}	
		}
	}
	function AddComment(){
		xhr.open("POST","DoAddComments.ashx",true);
		xhr.setreadystatechange=watchingComments;
		xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
		var urlData="sId"+sId+"&txtContents="+document.getElementByIdea("txtComments").value;
		xhr.send(urlData);
	}
	function watchingComments(){
		if(xhr.readyStates>=4){
			if(xhr.status==200){
				var resText=xhr.responseText;
				if(resText=="ok"){
					var commentsTable=document.getElementById("txtComments");//获取评论的表格对象
					var newRow=commentsTable.insertRow(commentsTable.row.length);
					var nTd1=newRow.insertCell();
					var nTd2=newRow.insertCell();
					nTd1.innerHtml=nowLoginUser;
					nTd2.innerHtml=document.getElementById("txtComments").value;
				}
				else{
					//todo:
				}
			}
			else{
				alert(xhr.status);
			}
		}
		
	}



<script>

 

View Code
 1 <br><script type="text/javascript">
 2 ?
 3     var xhr=false;
 4     var actionType;
 5     //todo:
 6     var sId=1;
 7   function createXmlHttp() {//创建xhr对象
 8             var xhobj = false;
 9             try {
10                 xhobj = new ActiveXObject("Msxml2.XMLHTTP"); // ie msxml3.0+
11             } catch (e) {
12                 try {
13                     xhobj = new ActiveXObject("Microsoft.XMLHTTP"); //ie msxml2.6
14                 } catch (e2) {
15                     xhobj = false;
16                 }
17             }
18             if (!xhobj && typeof XMLHttpRequest != 'undefined') {// Firefox, Opera 8.0+, Safari
19                 xhobj = new XMLHttpRequest();
20             }
21             return xhobj;
22         }
23     window.onload=function(){
24         xhr=new createXmlHttp();
25     }
26     function doSupport(isSupport){
27         xhr.open("POST","DoSupport.ashx",true);
28         xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
29         xhr.onreadystatechange=watching;
30         if(isSupport){
31             actionType=1;
32             xhr.send("sId="+sId+"&isSup="+actionType);
33         }
34         else{
35             actionType=0;
36             xhr.send("sId="+sId+"&isSup="+actionType);
37         }   
38     }
39     function watching(){
40         if(xhr.readyState>=4){
41             if(xhr.status==200){
42                 var resText=xhr.responseText;
43                 var resArr=resText.split(",");
44                 if(resArr[0]=="ok"){
45                     if(actionType==1){
46                         document.getElementById("spanSup").innerHtml=resArr[1];
47                     }
48                     else{
49                         document.getElementById("spanDisSup").innerHtml=resArr[1];
50                     }
51                 }
52                 else{
53                     //todo:
54                 }   
55             }   
56         }
57     }
58     function AddComment(){
59         xhr.open("POST","DoAddComments.ashx",true);
60         xhr.setreadystatechange=watchingComments;
61         xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
62         var urlData="sId"+sId+"&txtContents="+document.getElementByIdea("txtComments").value;
63         xhr.send(urlData);
64     }
65     function watchingComments(){
66         if(xhr.readyStates>=4){
67             if(xhr.status==200){
68                 var resText=xhr.responseText;
69                 if(resText=="ok"){
70                     var commentsTable=document.getElementById("txtComments");//获取评论的表格对象
71                     var newRow=commentsTable.insertRow(commentsTable.row.length);
72                     var nTd1=newRow.insertCell();
73                     var nTd2=newRow.insertCell();
74                     nTd1.innerHtml=nowLoginUser;
75                     nTd2.innerHtml=document.getElementById("txtComments").value;
76                 }
77                 else{
78                     //todo:
79                 }
80             }
81             else{
82                 alert(xhr.status);
83             }
84         }
85          
86     }
87  
88  
89  
90 <script>

© 著作权归作者所有

共有 人打赏支持
粉丝 2
博文 222
码字总数 199010
作品 0
黄浦
Ajax实现评论的顶和踩功能

这算是社团布置的一个假期小作业吧,我只是提出我自己的解决方案,不一定是最合适的。 效果大致如下: javascript这块使用jquery。新建一个Asp.net web项目,使用NuGet获取Jquery最新版。 数...

长平狐 ⋅ 2013/11/25 ⋅ 0

使用 jQuery, Angular.js 实现登录界面验证码详解

写在前面: 前段事件,做了一个用ajax后台异步交互的登录功能,自己在上面加了一个验证码的功能,这个功能背后的原理挺好理解的,实现起来也十分简单,特此写波分享,,自己写的过程中踩了不...

OB丶Koro1 ⋅ 2017/04/26 ⋅ 0

网易新闻的评论被顶数量是受到操纵的吗?

随便选择一篇新闻:http://comment.news.163.com/newsguonei8bbs/8TF1E94F00014JB6.html 对某条评论进行“顶”操作,点击后,发现ajax错误: POST http://comment.news.163.com/reply/upvot...

添加软件 ⋅ 2013/04/27 ⋅ 4

Jingle怎么传递参数啊

@问题石 你好,想跟你请教个问题: 社区博客 这个data-url 怎么传递参数啊比如我想点击这个后 ajax到blog.php?pid=4&ppid=4 还有救是accsess成功后..我不想是用js模板引擎,我想用原生态的js解...

amu1433 ⋅ 2014/05/29 ⋅ 2

【代码实现】PHP生成各种随机验证码

文章来源:PHP开发学习门户 (自行开发的个人网站) 验证码在WEB应用中非常重要,通常用来防止用户恶意提交表单,如恶意注册和登录、论坛恶意灌水等。本文将通过实例讲解使用PHP生成各种常见...

PHP开发学习门户 ⋅ 2014/10/07 ⋅ 0

jQuery中文教程和资源

帕兰映像里面已经发布过不少的jQuery插件和教程资源。本文里面,又为你收集一些优秀的中文jQuery教程和技巧资源,也许在你下次改善自己网站设计时有用。 一,和WORDPRESS相关的JQUERY技巧和教...

晨曦之光 ⋅ 2012/03/09 ⋅ 0

springmvc处理ajax请求

1.controller将数据封装成json格式返回页面 @RequestMapping("/dataList")public void datalist(CsoftCunstomerPage page,HttpServletResponse response) throws Exception{ } 2.ajax提交数据......

小麋鹿666 ⋅ 2017/01/06 ⋅ 0

一刀/simpleblog

Django1.7开发一个简单的博客系统 三个分支: master: 主分支 py27: 基于python2.7.8版本的分支 py34: 基于python3.4.2版本的分支 教程地址: http://my.oschina.net/yidao620c/blog/343...

一刀 ⋅ 2015/01/05 ⋅ 0

caffe的python接口学习(11):特征的批量提取

原文链接1:http://blog.csdn.net/guoyilin/article/details/42886365 修改prototxt实现 snippetid="2119236" snippetfilename="blog2017011217289472" name="code" class="html">caffe在[1]......

lilai619 ⋅ 2017/01/12 ⋅ 0

阳光企业网站管理系统--SCSCMS

阳光企业网站管理系统V2.0用户手册 阳光企业网站管理系统(Sunshine Corporation Site),简称SCSCMS或SCS,其标识及程序,属太阳光工作室版权所有。 本站公开发行的SCSCMS为开源免费程序,你...

匿名 ⋅ 2011/06/26 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

PHP语言系统ZBLOG或许无法重现月光博客的闪耀历史[图]

最近在写博客,希望通过自己努力打造一个优秀的教育类主题博客,名动江湖,但是问题来了,现在写博客还有前途吗?面对强大的自媒体站点围剿,还有信心和可能型吗? 至于程序部分,我选择了P...

原创小博客 ⋅ 23分钟前 ⋅ 0

IntelliJ IDEA 2018.1新特性

工欲善其事必先利其器,如果有一款IDE可以让你更高效地专注于开发以及源码阅读,为什么不试一试? 本文转载自:netty技术内幕 3月27日,jetbrains正式发布期待已久的IntelliJ IDEA 2018.1,再...

Romane ⋅ 48分钟前 ⋅ 0

浅谈设计模式之工厂模式

工厂模式(Factory Pattern)是 Java 中最常用的设计模式之一。这种类型的设计模式属于创建型模式,它提供了一种创建对象的最佳方式。 在工厂模式中,我们在创建对象时不会对客户端暴露创建逻...

佛系程序猿灬 ⋅ 今天 ⋅ 0

Dockerfile基础命令总结

FROM 指定使用的基础base image FROM scratch # 制作base image ,不使用任何基础imageFROM centos # 使用base imageFROM ubuntu:14.04 尽量使用官方的base image,为了安全 LABEL 描述作...

ExtreU ⋅ 昨天 ⋅ 0

存储,对比私有云和公有云的不同

导读 说起公共存储,很难不与后网络公司时代的选择性外包联系起来,但尽管如此,它还是具备着简单和固有的可用性。公共存储的名字听起来也缺乏专有性,很像是把东西直接堆放在那里而不会得到...

问题终结者 ⋅ 昨天 ⋅ 0

C++难点解析之const修饰符

C++难点解析之const修饰符 c++ 相比于其他编程语言,可能是最为难掌握,概念最为复杂的。结合自己平时的C++使用经验,这里将会列举出一些常见的难点并给出相应的解释。 const修饰符 const在c...

jackie8tao ⋅ 昨天 ⋅ 0

聊聊spring cloud netflix的HystrixCommands

序 本文主要研究一下spring cloud netflix的HystrixCommands。 maven <dependency> <groupId>org.springframework.cloud</groupId> <artifactId>spring-clo......

go4it ⋅ 昨天 ⋅ 0

Confluence 6 从其他备份中恢复数据

一般来说,Confluence 数据库可以从 Administration Console 或者 Confluence Setup Wizard 中进行恢复。 如果你在恢复压缩的 XML 备份的时候遇到了问题,你还是可以对整个站点进行恢复的,如...

honeymose ⋅ 昨天 ⋅ 0

myeclipse10 快速搭建spring boot开发环境(入门)

1.创建一个maven的web项目 注意上面标红的部分记得选上 2.创建的maven目录结构,有缺失的目录可以自己建立目录补充 补充后 这时候一个maven的web项目创建完成 3.配置pom.xml配置文件 <proje...

小海bug ⋅ 昨天 ⋅ 0

nginx.conf

=========================================================================== nginx.conf =========================================================================== user nobody; #......

A__17 ⋅ 昨天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部