您好,欢迎来到三六零分类信息网!老站,搜索引擎当天收录,欢迎发信息

Ajax的实现异步刷新详解

2024/2/28 1:14:06发布11次查看
这次给大家带来ajax的实现异步刷新详解,ajax实现异步刷新的注意事项有哪些,下面就是实战案例,一起来看一下。
所谓的异步刷新,就是不刷新整个网页进行更新数据。
只有通过js才能实现ajax,进而实行异步刷新
表单提交数据和ajax提交数据的区别:表单提交是提交的整个页面中的数据,提交数据之后会抛弃之前的页面(刷新页面);ajax是在当前页面提取某些数据并提交出去,并能接收返回来的数据,处理之后进而显示在当前页面(不刷新页面)。
【例子】==验证用户名是否重复==
使用ajax的思路:在要刷新的页面中写js和ajax代码,把数据提交给另一个页面,在page_load中写查询代码并把结果返回到刷新的页面。
界面
一、使用linq连接数据库
二、把jquery文件导入到项目中。代码写在<head>中
<script src="js/jquery-1.2.3.pack.js" type="text/javascript"></script>
三、在刷新的页面写如下代码。代码写在<head>中
<script src="js/jquery-1.2.3.pack.js" type="text/javascript"></script> <%--调用jquery--%>    <script>   $(document).ready(//当页面准备好加载完成的时候触发    function getval() {     $(#textbox1).blur(function () {//当鼠标点击或离开时触发      var txt = $(this).val();//获取文本框的值          //使用ajax发送出来文本框的值             $.ajax( {       url: de.aspx,       type: post,       data: {id:txt},           //接收数据库返回的信息       datatype: xml,       success: function (data) {//data中的数据就是de页面中count的数据        var co = $(data).text();        if (parseint(co) == 0) {         var lbl = document.getelementbyid(label1);//利用js输出         lbl.innerhtml = √;        } else {         var lbl = document.getelementbyid(label1);         lbl.innerhtml = 此用户名已注册;        }                }      });     });    });  </script>
四、在传值的页面中的page_load中写如下代码
protected void page_load(object sender, eventargs e)  {   //查询传过来的数据   dataclassesdatacontext dc = new dataclassesdatacontext();   string uid = request[id].tostring();   int count = dc.stopro.where(r => r.stoid == int.parse(uid)).count();   //以xml形式返回   response.write(<?xml varsion='1.0'?>);   response.write(<count> + count + </count>);   response.end();//关掉response    }
完成!
相信看了本文案例你已经掌握了方法,更多精彩请关注其它相关文章!
推荐阅读:
http的报文与ajax基础知识详解
ajax怎样实现不刷新的情况下上传文件
以上就是ajax的实现异步刷新详解的详细内容。
该用户其它信息

VIP推荐

免费发布信息,免费发布B2B信息网站平台 - 三六零分类信息网 沪ICP备09012988号-2
企业名录 Product