通过 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. JAVA实现AES 解密报错Input length must be multiple of 16 when decrypting with padded cipher

    加密代码 /**解密 * @param content 待解密内容 * @param password 解密密钥 * @return */ public static byte[] decrypt(b ...

  2. angluar去掉url中#

    众所周知,angular项目中路由机制会在地址栏加一个#来实现各个页面的切换,虽然url中有个#号也无伤大雅,但每次看到多一个这个东西总是不舒服(我不是强迫证啊),趁着项目间隙还是决定把它去掉. 去谷 ...

  3. Code of Conduct

    v

  4. 简单说说.Net中的弱引用

    弱引用是什么? 要搞清楚什么是弱引用,我们需要先知道强引用是什么.强引用并不是什么深奥的概念,其实我们平时所使用的.Net引用就是强引用.例如: Cat kitty = new Cat(); 变量ki ...

  5. SQl SGA 整理

    --查看诊断位置信息 select * from v$diag_info; --查看sga中内存分配信息 select * from sys.x$ksmfs; --查看内存块还剩余多少 select ...

  6. Oracle EBS - Profile Setting

    EBS Profile Setting (Personalization Basics): Personalization Basics For R12 Forms Enable personaliz ...

  7. Hbuilder开发HTML5 APP之图标和启动页制作

    1.点击项目下的"manifest.json"文件,会出现自动化的配置工具: 2.点“图标配置“,上传制作好的图标文件,自动生成不同大小的ico,这个要赞下! 3.启动图片(spl ...

  8. 系统吞吐量（TPS）、用户并发量、性能测试概念和公式

    分享一个概念: http://www.ha97.com/5095.html

  9. 广州PostgreSQL用户会技术交流会小记 2015-9-19

    广州PostgreSQL用户会技术交流会小记 2015-9-19 今天去了广州PostgreSQL用户会组织的技术交流会 分别有两个session 第一个讲师介绍了他公司使用PostgreSQL-X2 ...

  10. 安装zookeeper

    从zookeeper官方网站下载安装包:zookeeper-3.4.9.tar.gz 解压安装 tar xvf zookeeper-3.4.9.tar.gz -C /usr/java cd /usr/ ...