用JQuery Ajax 与一般处理程序 请求数据无刷新,以及如何调试错误
通过 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 与一般处理程序 请求数据无刷新,以及如何调试错误的更多相关文章
- jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据
jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据 这个是jQuery 的底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等. $.ajax() ...
- Ajax--PHP+JQuery+Ajax解析json、XML数据、加载页面
一.JQuery+Ajax用get.post方式提交和请求数据 知识要点: $('#userName').blur(function () { var txt = $(this).val(); $.a ...
- 2016 系统设计第一期 (档案一)jQuery ajax serialize()方法form提交数据
jQuery ajax serialize()方法form提交数据,有个很奇怪的问题,好像不能取到隐藏控件的值. //点击提交按钮保存数据 $('#btn_submitUser').click(fun ...
- Jquery EasyUI +Ajax +Json +一般处理程序 实现数据的前台与后台的交互 --- 善良公社项目
经过上一篇博客,本节主要是来看实现的功能是后台的数据通过json数据传过来,前台修改的数据再传回数据库之后页面再次更新table中的数据: 图示: 实例:前台的代码 <%--表格显示区--%&g ...
- jQuery基础(Ajax,load(),getJSON(),getScript(),post(),ajax(),同步/异步请求数据)
1.使用load()方法异步请求数据 使用load()方法通过Ajax请求加载服务器中的数据,并把返回的数据放置到指定的元素中,它的调用格式为: load(url,[data],[callba ...
- 当jquery ajax遇上401请求
jquery ajax是个很常用接口,而在请求时候,可能存在响应401的情况(身份认证过期或未登录),比较容易出现在混合应用上,如何进行身份认证,重发失败请求,还是值得注意的. ajax请求有两种方式 ...
- Jquery+Ajax实现Select动态添加数据
https://blog.csdn.net/zhengxiangwen/article/details/46480687 最近在工作中,遇到了一个关于select的问题.一般情况下,select下拉框 ...
- SharePoint 2010 以Jquery Ajax方式更新SharePoint列表数据!
之前本人的博客介绍了<sharepoint 2010自定义访问日志列表设置移动终端否和客户端访问系统等计算列的公式>,那如何通过Jquery提交访问日志到自定义的SharePoint的访问 ...
- ajax 删除数据无刷新
//html页面 <!doctype html><head> <title></title> <meta http-equiv="Con ...
随机推荐
- 封装一些常用的js工具函数-不定时更新(希望大家积极留言,反馈bug^_^)
/*华丽------------------------------------------------------------------------------------------------ ...
- 【翻译】Express web应用开发 第一章
本章节是一个对初学者友好的Express介绍.你将学习到Express的基础知识.核心概念和实现一个Express应用的组成部分.现阶段我们不需要做太多的编码,本章节会让你熟悉和习惯Express,为 ...
- iOS 琐碎点------切某个或某几个角的圆角
不说废话----------> 1.如果是切四个角的圆角,代码示例: self.picImage.layer.cornerRadius = 8; self.picImage.layer.mask ...
- 学习笔记:java线程安全
首先得明白什么是线程安全: 线程安全是编程中的术语,指某个函数 (计算机科学).函数库在多线程环境中被调用时,能够正确地处理各个线程的局部变量,使程序功能正确完成. 这是维基百科里的资料,看完后还不是 ...
- SQL Server数据库镜像的页面自动修复原理
SQL Server数据库镜像的页面自动修复原理 主库页面损坏 镜像库页面损坏 LSN用来保证事务的时序 LSN保存在每个数据页面的页头 在同一台机器,内存中的数据页和磁盘中的数据页保持同步依靠的是数 ...
- 那点你不知道的XHtml(Xml+Html)语法知识(DTD、XSD)
什么是XHtml: 摘录网上的一句话,XHTML就是一个扮演着类似HTML的角色的XML. XHtml可当模板引擎应用: CYQ.Data 框架里有一套XHtmlAction模板引擎, 应用在QBlo ...
- Servant:基于Web的IIS管理工具
Servant for IIS是个管理IIS的简单.自动化的Web管理工具.安装Servant的过程很简单,只要双击批处理文件Install Servant Service.bat,然后按照屏幕上的说 ...
- 使用jQuery Uploadify在ASP.NET 上传附件
Uploadify是JQuery的一个上传插件,实现的效果非常不错,带进度显示.Uploadify官方网址:http://www.uploadify.com/,在MVC中使用的方法可以参考 jQuer ...
- 安卓动态调试七种武器之孔雀翎 – Ida Pro
安卓动态调试七种武器之孔雀翎 – Ida Pro 作者:蒸米@阿里聚安全 0x00 序 随着移动安全越来越火,各种调试工具也都层出不穷,但因为环境和需求的不同,并没有工具是万能的.另外工具是死的,人是 ...
- 递归算法经典实例小结(C#实现)
一 .递归算法简介 在数学与计算机科学中,递归是指在函数的定义中使用函数自身的方法. 递归算法是一种直接或者间接地调用自身算法的过程.在计算机编写程序中,递归算法对解决一大类问题是十分有效的,它往往 ...