通过 ajax() 与 一般处理程序，请求数据库数据，实现界面无刷新。

Jquery ajax 请求参数详细说明 http://www.w3school.com.cn/jquery/ajax_ajax.asp

代码：

 <!DOCTYPE html>

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head runat="server">

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

     <title></title>

     <script src="jquery-1.3.2-vsdoc2.js"></script>

 </head>

 <body>

     <form id="form1" runat="server">

     <div style="margin: 50px;">

     <input value="点击" type="button" id="btn"/>

     </div>

     </form>

 <script type="text/javascript">

     $(document).ready(function () {

         $('#btn').click(function () {

             $.ajax({

                 url: 'ashx/Handler1.ashx',//string类型的参数，发送请求的地址

                 type: 'POST',//请求方式（post or get）默认为get

                 contenType: "application/json;charset-utf-8",//发送信息至服务器时内容编码类型

                 dataType: 'text',//预期服务器返回的数据类型

                 data: {},//发送的请求数据

                 success: function (data) {

                     alert(data);

                 }

             });

         });

     })

 </script>

 </body>

 </html>
 using System.Web;

 namespace DemoAjxa.ashx

 {

     /// <summary>

     /// Handler1 的摘要说明

     /// </summary>

     public class Handler1 : IHttpHandler

     {

         public void ProcessRequest(HttpContext context)

         {

             context.Response.ContentType = "text/plain";

             context.Response.Write("Hello World");

         }

         public bool IsReusable

         {

             get

             {

                 return false;

             }

         }

     }

 }

效果：

上面是post请求，获得纯文本字符串，如果是要获得json 数据的话

则需要将ajax 的参数dataType设为 josn，一般处理程序 context.Response.Write();返回的数据类型也必须是json 格式哦

然后将获得的json 数据解析并绑定到界面上

列: dataType: 'json',//预期服务器返回的数据类型


data{name:'huangenai'}如果data带参数，
在一般处理程序这样可以获得传过来的参数
string name=context.Request["name"].ToString();

关于请求返回为error
1.查看 url 请求地址是否正确

火狐浏览器，安装插件 Firebug,F12可以看到报错了 显示请求地址NotFound

2.data{} 即时不传参数也要这样写上哦，不然会报错的

3.返回的数据类型是否与 dataType 一致

如果不一致则会报错

4.检查时否发生了跨域的请求

5.编码格式是否正确

当然也可以在代码中这样写，将错误输出查看到底是什么错误

 <script type="text/javascript">

     $(document).ready(function () {

         $('#btn').click(function () {

             $.ajax({

                 url: 'ashx/Handler1.ashx',//string类型的参数，发送请求的地址

                 type: 'POST',//请求方式（post or get）默认为get

                 contenType: "application/json;charset-utf-8",//发送信息至服务器时内容编码类型

                 dataType: 'text',//预期服务器返回的数据类型

                 data: {name:'huangenai'},//发送的请求数据

                 success: function (data) {

                     alert(data);

                 }, error: function (XMLHttpRequest) {

                     alert("Ajax请求失败，错误状态为："+XMLHttpRequest.status);

                 }

             });

         });

     })

 </script>

效果：

XMLHttpRequest 对象

属性

readyState：请求状态，开始请求时值为0直到请求完成这个值增长到4（readyState共有5中状态，0未初始化，1已初始化，2发送请求，3开始接收结果，4接收结果完毕。）

responseText：目前为止接收到的响应体,readyState<3此属性为空字符串，=3为当前响应体，=4则为完整响应体

responseXML：服务器端相应，解析为xml并作为Document对象返回

status：服务器端返回的状态码，=200成功，=404表示“Not Found”

statusText：用名称表示的服务器端返回状态，对于“OK”为200，“Not Found”为400

用JQuery Ajax 与一般处理程序 请求数据无刷新，以及如何调试错误的更多相关文章

  1. jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据

    jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据 这个是jQuery 的底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等. $.ajax() ...

  2. Ajax--PHP+JQuery+Ajax解析json、XML数据、加载页面

    一.JQuery+Ajax用get.post方式提交和请求数据 知识要点: $('#userName').blur(function () { var txt = $(this).val(); $.a ...

  3. 2016 系统设计第一期 （档案一）jQuery ajax serialize()方法form提交数据

    jQuery ajax serialize()方法form提交数据,有个很奇怪的问题,好像不能取到隐藏控件的值. //点击提交按钮保存数据 $('#btn_submitUser').click(fun ...

  4. Jquery EasyUI +Ajax +Json +一般处理程序 实现数据的前台与后台的交互 --- 善良公社项目

    经过上一篇博客,本节主要是来看实现的功能是后台的数据通过json数据传过来,前台修改的数据再传回数据库之后页面再次更新table中的数据: 图示: 实例:前台的代码 <%--表格显示区--%&g ...

  5. jQuery基础（Ajax，load()，getJSON()，getScript()，post()，ajax()，同步/异步请求数据）

    1.使用load()方法异步请求数据   使用load()方法通过Ajax请求加载服务器中的数据,并把返回的数据放置到指定的元素中,它的调用格式为:   load(url,[data],[callba ...

  6. 当jquery ajax遇上401请求

    jquery ajax是个很常用接口,而在请求时候,可能存在响应401的情况(身份认证过期或未登录),比较容易出现在混合应用上,如何进行身份认证,重发失败请求,还是值得注意的. ajax请求有两种方式 ...

  7. Jquery+Ajax实现Select动态添加数据

    https://blog.csdn.net/zhengxiangwen/article/details/46480687 最近在工作中,遇到了一个关于select的问题.一般情况下,select下拉框 ...

  8. SharePoint 2010 以Jquery Ajax方式更新SharePoint列表数据！

    之前本人的博客介绍了<sharepoint 2010自定义访问日志列表设置移动终端否和客户端访问系统等计算列的公式>,那如何通过Jquery提交访问日志到自定义的SharePoint的访问 ...

  9. ajax 删除数据无刷新

    //html页面 <!doctype html><head> <title></title> <meta http-equiv="Con ...

随机推荐

  1. IIS 连接 oracle报Oracle.DataAccess版本错误解决办法

    通过IIS连接oracle时报“Could not load file or assembly 'Oracle.DataAccess, Version=2.112.3.0, Culture=neutr ...

  2. Python之路Day18-正则及Django

    一. 正则表达式 1.定义正则表达式 /.../  用于定义正则表达式 /.../g 表示全局匹配 /.../i 表示不区分大小写 /.../m 表示多行匹配JS正则匹配时本身就是支持多行,此处多行匹 ...

  3. GIT本地免密配置

    在C:\Users\计算机名    下面找到.gitconfig文件(如果没有请新建) 内容为: [user]    name = git用户名[user]    email = 邮箱   [cred ...

  4. php与js中函数参数的默认值设置

    php函数参数默认值设置: <?phpfunction test($val=3){   echo $val."<br/>";}test(11);test();?& ...

  5. 【noip】noip201503求和（市赛后公布）

    3. 求和 难度级别:B: 运行时间限制:1000ms: 运行空间限制:51200KB: 代码长度限制:2000000B 题目描述   一条狭长的纸带被均匀划分出了n个格子,格子编号从1到n.每个格子 ...

  6. C++大会感悟

    写在前面: 我是一名学生,在北邮读研,也是跨专业学的计算机,个人对服务器端编程感兴趣,平时主用c/c++,所以逮到这次机会就参加了这次大会. 先附几张合影: 正文: 这次参加c++大会也算是我最认真的 ...

  7. ecshop二次开发 商品分类描述编辑框

  8. ios视频播放器，代码和界面分离

    最近业余时间整理的一个ios播放器,界面采用storyboard,以前几乎都是用代码布局,但是用过一个项目storyboard后,就感觉storyboard很靠谱,团队合作版本控制的问题解决其实很简单 ...

  9. TaintDroid深入剖析之启动篇

    ​1 背景知识 1.1   Android平台软件动态分析现状 众所周知,在计算机领域中所有的软件分析方法都可以归为静态分析和动态分析两大类,在Android平台也不例外.而随着软件加固.混淆技术的不 ...

  10. [.net 面向对象程序设计进阶] (24) 团队开发利器（三）使用SVN多分支并行开发(下)

    [.net 面向对象程序设计进阶] (24) 团队开发利器(三)使用SVN多分支并行开发(下) 本篇导读: 接上篇继续介绍SVN的高级功能,即使用分支并行开发.随着需求的不断变更,新功能的增加.特别是 ...