手机版

基于框架实现创建交互式、快速动态网页应用的网页开发技术无刷新评论

时间:2021-10-30 来源:互联网 编辑:宝哥软件园 浏览:

框架实现创建交互式、快速动态网页应用的网页开发技术无刷新评论需要用的技术:(本次试验用的是" jquery-1.4.2.js "版本的jquery)

$.' post('一般处理程序路径',{以字典的形式传递参数},函数(数据,状态){ ` ` ` ` `});框架中的基本选择器操作;

首先创建数据库“T_article”:

主键设置自增;

然后创建一个强类型的数据集。

接着创建一个"无刷新评论. aspx "页面:

页面代码如下:

div h2文章:/H2 p这是一条短信!这是一条短信!这是一条短信!这是一条短信!这是一条短信!这是一条短信!这是一条短信!这是一条短信!这是一条短信!这是一条短信!这是一条短信!这是一条短信!这是一条短信!这是一条短信!这是一条短信!这是一条短信!这是一条短信!这是一条短信!这是一条短信!这是一条短信!这是一条短信!这是一条短信!这是一条短信!/p ul id=' pinglunlist '/ul/div文本区域id=' msg ' style=' margin-left :20 px;'cols='40 '行='10'/textarea输入id=' btnpingrun ' type=' button ' value='评论' /然后创建两个一般处理程序WSXPL.ashx(用来插入数据的处理程序)和WSXPL1.ashx(用来获取所有评论数据的处理程序);

WSXPL.ashx中的代码如下:

公共无效进程请求(HttpContext上下文){上下文.响应。内容类型='文本/纯文本;字符串消息=上下文。请求['消息'];新的T_articleTableAdapter().插入(上下文。请求。用户主机地址,消息,日期时间。现在);//创建一个强类型的实例,然后调用插入()函数插入;语境。回应。写下(“ok”);}WSXPL1.ashx中的代码如下:

公共无效进程请求(HttpContext上下文){上下文.响应。内容类型='文本/纯文本;var data=new T _ article tableadapter().GetData();//返回的是一个DataTable StringBuilder sb=new StringBuilder();//创建StringBuilder更加方便的搜集数据foreach(数据中的定义变量数据)//用为每一个方法遍历DataTable {//实现字符串的拼接;每行数据用$隔开,每行数据的每个元素用|隔开;有利于前台解析数据;某人(某人的简写)追加(data.ipaddress).追加(' | ')。追加(data.msg).追加(' | ')。追加(data.posttime).追加(' $ ');}上下文。回复(某人);}做完这些步骤,操作数据库的部分就已经完成了。现在只要在前台把一般处理程序返回的数据解析一下并附加的相应的位置就可以了!

首先在前台引用“jquery-1。4 .2 .js"jquery库;然后开始编写射流研究…脚本;

$(function () { $).post('WSXPL1.ashx ',函数(数据,状态){ //通过WSXPL1.ashx获取所有的评论内容if(status==' success '){ var result=data。拆分(' $ ');//按照$分割字符串for(var I=0;我结果。长度-1;i ) { var msg=结果[一];var line=msg。拆分(' | ');//按照|分割字符串var pinglun=$('li用户标识:"第[0]行";评论内容:'第[1]行;评论时间:'第[2]行/Li’);$('#pinglunlist ').追加(平伦);//把得到的评论结果追加到保险商实验所元素上} } else { alert('ajax错误!');} })$(' # BTN平伦').单击(函数(){ //设置按钮事件var msg=$('#msg ').val();$.post('ashx/WSXPL.ashx ',{ 'msg': msg },函数(数据,状态){ if(状态=='success') { if(数据=='ok') { $).post('WSXPL1.ashx ',函数(数据,状态){ //为了实现评论的时候评论内容会自动的添加到保险商实验所上if(status==' success '){ var result=data。拆分(' $ ');var msg=结果[结果。长度-2];//获取最后一条评论var line=msg。拆分(' | ');var pinglun=$('li用户标识:"第[0]行";评论内容:'第[1]行;评论时间:'第[2]行/Li’);$('#pinglunlist ').追加(平伦);//把最后一条评论追加到保险商实验所上} else { alert('ajax错误!');} })警报('评论成功!');} else { alert('评论失败!');} } }) }) })做完这些直接运行就可以了!以上就是本文的全部内容,希望对大家的学习有所帮助。

版权声明:基于框架实现创建交互式、快速动态网页应用的网页开发技术无刷新评论是由宝哥软件园云端程序自动收集整理而来。如果本文侵犯了你的权益,请联系本站底部QQ或者邮箱删除。