通过 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. python pickle和json的区别

    pickle可以在python之间进行交互 json可以实现python与不同开发语言的交互 pickle可以序列化python中的任何数据类型 json只能序列化python中的常归数据类型(列表等 ...

  2. Python之路Day12--mysql介绍及操作

    上节回顾: 1. RabbitMQ a. 平均分发 b. perfetch = 1 c. durable 队列持久化  deliver_mode = 2 消息持久化 d. 1对多广播  exchang ...

  3. Xamarin的不归路-ios模拟器没有键盘

    ios模拟器没有键盘解决方案: 勾选上就有了. 2016年9月1日

  4. 递归一题总结（OJ P1117倒牛奶）

    题目:                    农民约翰有三个容量分别是A,B,C升的桶,A,B,C分别是三个从1到20的整数,最初,A和B桶都是空的,而C桶是装满牛奶的.有时,约翰把牛奶从一个桶倒到另 ...

  5. CSS 页面顶部阴影和给浏览器强制加上滚动条

    /*给浏览器强制加上滚动条*/ html{height: 101%;} /*页面顶部阴影*/ body:before{ content: ""; position: fixed; ...

  6. php 图片上传的公共方法（按图片宽高缩放或原图）

    写的用于图片上传的公共方法类调用方法: $upload_name='pic';$type = 'logo_val';$file_name = 'logo_' . $user_id .create_st ...

  7. Collections+Iterator 接口 | Map+HashMap+HashTable+TreeMap |

    Collections+Iterator 接口 1. Collections 是一个操作 Set.List 和 Map 等集合的工具类 Collections 中提供了大量方法对集合元素进行排序.查询 ...

  8. 发布一个自用的ansi转utf8程序

    前几天网上下载了一个国外的源码示例,布署到IIS上,查看网页中文显示乱码,各种不方便,你懂的. 用记事本打开文件,显示是ANSI格式,另存为UTF8格式,保存,再查看页面就正常显示中文了. 文件好多, ...

  9. jquery.ajax

    var params = {};//定义一个数组 var USERNAME= $("#USERNAME").val(); params["USERNAME"]= ...

  10. ASP.NET Identity V2

    Microsoft.AspNet.Identity是微软在MVC 5.0中新引入的一种membership框架,和之前ASP.NET传统的membership以及WebPage所带来的SimpleMe ...