$('#re_method01').html(re)
})复制代码(2)单独.aspx 页(新建的时候不勾选 “将代码放在单独的文件中”) + 任意.cs文件(需要继承System.Web.UI.Page) .aspx文件中代码 <%@ Page Inherits="命名空间.类" %>(3).ashx页面这里主要知识点就是继承了IHttpHandler接口。来实现Http web相关的事件处理。
实现方法:新建后注销掉context.Response.Write("Hello World")改为你的事件处理代码即可。1,2,3的前台ajax调用方法都一样。如果需要区分不同的ajax调用。我们可以传递一个不同值的 type 参数。后台再通过switch执行各自的处理程序。(4)利用System.Web.Services.WebMethodAttribute。在(1)的基础上引用命名空间using System.Web.Services然后在需要异步执行的方法上添加[WebMethod]属性。 [WebMethod]
publicstaticstring HandleEvent01(string para,string para2){//code...return"YOUR DATA"
}复制代码前台调用代码: $.ajax({
type: "POST",
contentType: "application/json",
url: "AjaxWebService.aspx/HandleEvent01", //调用WebService的地址和方法名称组合 ---- WsURL/方法名 data: "{'para':'bill','para2':'28'}", //这里是要传递的参数,注意参数名跟后台方法参数名的对应 dataType: 'json', //WebService 返回Json类型 或者 Json/string success: function(re) {
publicstaticstring HandleEvent01(){//code...return"some words"}[WebMethod]
publicstatic Person AjaxMethodThree(string para){returnnew Person { Name = "bill", Country = "China", Favor = newstring[] { "Box", "Music", "Football" } }}[WebMethod]
publicstatic List<Person>AjaxMethodTwo(string para){List<Person>personlist = new List<Person>()
personlist.Add(new Person { Name = "bill", Country = "China", Favor = newstring[] { "Box1", "Film1", "Football1" } })
personlist.Add(new Person { Name = "tom", Country = "USA", Favor = newstring[] { "Box2", "Music2", "Football2" } })
personlist.Add(new Person { Name = "lucy", Country = "Korea", Favor = newstring[] { "Box3", "Music3", "Football3" } })
return personlist}//定义一个Person对象publicclass Person{publicstring Name { getset}
publicstring Country { getset}
publicstring[] Favor { getset}
}复制代码1.返回字符串
json:{"d":"字符串"}
2.返回类型为自定义对象, 前端返回值为一个对应的JSON对象
json:{"d":{"name1":"value1","name2":"value2"...}}
3,返回类型为泛型列表, 前端返回值为对应的JSON对象数组。如果我们异步就是需要返回json格式数据,这样就很方便。同时,除了以WebService的方式被调用,这个页面也可以以普通URL的方式来异步访问,也就是(1)的情况。(5)调用WebService添加web 服务。会生成一个WebServicexxx.asmx以及WebServicexxx.cs.异步程序在WebServicexxx.cs中实现,基本跟(4)差不多。 (6)MVC中的ajax异步实现1.直接在控制器中写public string Ajax(){return "re"}方法,不用额外建视图文件。
2.或者你要返回的内容结构还比较复杂,新建一个_Ajax.cshtml分部视图。控制器中代码:public ActionResult Ajax(){//...your code...return PartialView("_Ajax")
}复制代码前台调用代码: $.post("/控制器名/ajax" , { type:'getData01' },function(re){
})复制代码上面的代码整理到了一个项目里 代码下载
一提到异步交互大家就会说ajax,仿佛ajax这个技术已经成为了异步交互的代名词.那下面将研究ajax的核心对象!利用ajax实现异步交互无非4步:
创建ajax核心对象
与服务器建立连接
向服务器发送请求
接收服务器响应的数据
看似神秘的异步交互当明确这4步后,也许在大家脑海里已经有了初步的思路了
首先我们创建ajax的核心对象,由于浏览器的兼容问题我们在创建ajax核心对象的时候不得考虑其兼容问题,因为要想实现异步交互的后面步骤都基于第一步是否成功的创建了ajax核心对象.
function
getXhr(){
//
声明XMLHttpRequest对象
var
xhr
=
null
//
根据浏览器的不同情况进行创建
if(window.XMLHttpRequest){
//
表示除IE外的其他浏览器
xhr
=
new
XMLHttpRequest()
}else{
//
表示IE浏览器
xhr
=
new
ActiveXObject('Microsoft.XMLHttp')
}
return
xhr
}
//
创建核心对象
var
xhr
=
getXhr()
通过上述代码我们已经成功的创建了ajax核心对象,我们保存在变量xhr中,接下来提到的ajax核心对象都将以xhr代替.
第二步就是与服务器建立连接,通过ajax核心对象调用open(method,url,async)方法.
open方法的形参解释:
method表示请求方式(get或post)
url表示请求的php的地址(注意当请求类型为get的时候,请求的数据将以问号跟随url地址后面,下面的send方法中将传入null值)
async是个布尔值,表示是否异步,默认为true.在最新规范中这一项已经不在需要填写,因为官方认为使用ajax就是为了实现异步.
xhr.open("get","01.php?user=xianfeng")//这是get方式请求数据
xhr.open("post","01.php")//这是以post方式请求数据
第三步我们将向服务器发送请求,利用ajax核心对象调用send方法
如果是post方式,请求的数据将以name=value形式放在send方法里发送给服务器,get方式直接传入null值
xhr.send("user=xianfeng")//这是以post方式发送请求数据
xhr.send(null)//这是以get方式
第四步接收服务器响应回来的数据,使用onreadystatechange事件监听服务器的通信状态.通过readyState属性获取服务器端当前通信状态.status获得状态码,利用responseText属性接收服务器响应回来的数据(这里指text类型的字符串格式数据).后面再写XML格式的数据和大名鼎鼎的json格式数据.
xhr.onreadystatechange
=
function(){
//
保证服务器端响应的数据发送完毕,保证这次请求必须是成功的
if(xhr.readyState
==
4&&xhr.status
==
200){
//
接收服务器端的数据
var
data
=
xhr.responseText
//
测试
console.log(data)
}
}
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)