通过 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. druid sql黑名单 报异常 sql injection violation, part alway true condition not allow

    最近使用druid,发现阿里这个连接池 真的很好用,可以监控到连接池活跃连接数 开辟到多少个连接数 关闭了多少个,对于我在项目中查看错误 问题,很有帮助, 但是最近发现里面 有条sql语句 被拦截了, ...

  2. CentOS 7 防止端口自动关闭

    tl;dr firewall-cmd --permanent --zone=public --add-port=2888/tcp firewall-cmd --reload #重新载入服务 永久配置f ...

  3. 模拟--poj1835宇航员的故事

    这道题委实无语了,刚开始以为是很一般的方位模拟题,懒得看样例直接写的代码,然后敲了好几个switch结果样例居然没出来.. 仔细分析了样例之后才发现原来随着宇航员方位的改变他的左手方向以及头顶方向是跟 ...

  4. lucene和es总结

    一.首先介绍lucene涉及到的排序过程 1.1.如何自定义排序对象 你可以自定义collector对象: 亦可以自定义comparator对象: 可以自定义scoredoc对象,决定如何处理结果集合 ...

  5. git使用手册

    1.git常用命令 >>首先做git clone 形成本地repository: >>然后做checkout形成分支 列出所有分支  $ git branch –r 切换到新分 ...

  6. dfs判断连通图（无向）

    在图论中,连通图基于连通的概念.在一个无向图 G 中,若从顶点vi到顶点vj有路径相连(当然从vj到vi也一定有路径),则称vi和vj是连通的.如果 G 是有向图,那么连接vi和vj的路径中所有的边都 ...

  7. 电容参数：X5R，X7R，Y5V，COG 详解

    电容参数:X5R,X7R,Y5V,COG 详解 文章来源:http://www.hzlitai.com.cn/article/ARM9-article/cphard/1777.html 仅供分享学习~ ...

  8. Page

    <!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head> <met ...

  9. 多位数每一位个系数:个位num%10;十位num/10%10.......

    请输出满足这样条件的五位数. 个位=万位 十位=千位 个位+十位+千位+万位=百位 思路: 1.定义一个要操作的五位数变量num 2.求出每一位个系数 个:num%10 十:num/10%10 百:n ...

  10. MyBatis（跨表查询）

    1.建立数据库表如下: DROP TABLE IF EXISTS t_demo_user; CREATE TABLE IF NOT EXISTS t_demo_user( userid ), user ...