最近正在拜讀<<ajax in action>>這本書(shū),運(yùn)用書(shū)中知識(shí),結(jié)合.net,寫(xiě)了這篇用.net 處理xmlhttp發(fā)送異步請(qǐng)求的文章。
我們要達(dá)到的目的是點(diǎn)擊按鈕,獲得服務(wù)器的當(dāng)前時(shí)間,aspx的html如下:
html
<%@ page language="c#" autoeventwireup="true" codebehind="default.aspx.cs" inherits="linkedu.web.webwww.default" %>
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>測(cè)試</title>
<script language="javascript" src="javascript/prototype/extras-array.js"></script>
<script language="javascript" src="javascript/xmlhttp.js"></script>
<script language="javascript" src="javascript/eventrouter.js"></script>
<script language="javascript" src="default.js"></script>
<script language="javascript">
</script>
</head>
<body>
<form id="form1" runat="server">
用post方式獲得服務(wù)器的當(dāng)前時(shí)間
<input id="btntestpost" type="button" value="post" />
用get方式獲得服務(wù)器的當(dāng)前時(shí)間
<input id="btntestget" type="button" value="get" />
<div id="divresult"></div>
</form>
</body>
</html>
要用javascript 發(fā)送xmlhttp 請(qǐng)求必須解決的問(wèn)題是跨瀏覽器的支持。我們把xmlhttp的發(fā)送封裝在一個(gè)javascript對(duì)象中,同時(shí)在這個(gè)對(duì)象中解決了跨瀏覽器支持的問(wèn)題。代碼如下:
xmlhttp對(duì)象
/**//*
url-loading object and a request queue built on top of it
*/
/**//* namespacing object */
var net=new object();
net.ready_state_uninitialized=0;
net.ready_state_loading=1;
net.ready_state_loaded=2;
net.ready_state_interactive=3;
net.ready_state_complete=4;
/**//*--- content loader object for cross-browser requests ---*/
net.xmlhttp=function(url, onload, params, method, contenttype, onerror){
this.req=null;
this.onload=onload;
this.onerror=(onerror) ? onerror : this.defaulterror;
if(typeof(method) == "undefined" || method == null)
{
method = "post";
}
this.loadxmldoc(url, params, method, contenttype);
}
net.xmlhttp.prototype.loadxmldoc=function(url, params, method, contenttype){
if (!method){
method="get";
}
if (!contenttype && method=="post"){
contenttype='application/x-www-form-urlencoded';
}
if (window.xmlhttprequest){
this.req=new xmlhttprequest();
} else if (window.activexobject){
this.req=new activexobject("microsoft.xmlhttp");
}
if (this.req){
try{
var loader=this;
this.req.onreadystatechange=function(){
net.xmlhttp.onreadystate.call(loader);
}
this.req.open(method,url,true);
if (contenttype){
this.req.setrequestheader('content-type', contenttype);
}
this.req.send(params);
}catch (err){
this.onerror.call(this);
}
}
}
net.xmlhttp.onreadystate=function(){
var req=this.req;
var ready=req.readystate;
if (ready==net.ready_state_complete){
var httpstatus=req.status;
if (httpstatus==200 || httpstatus==0){
this.onload.call(this);
}else{
this.onerror.call(this);
}
}
}
net.xmlhttp.prototype.defaulterror=function(){
alert("error fetching data!"
+"/n/nreadystate:"+this.req.readystate
+"/nstatus: "+this.req.status
+"/nheaders: "+this.req.getallresponseheaders());
}
下面開(kāi)始寫(xiě)發(fā)送xmlhttp請(qǐng)求的代碼:
default.js
//全局xmlhttp對(duì)象
var cobj;
/**//* post begin*/
//綁定post發(fā)送xmlhttp事件到btntestpost
function loadtestpost()
{
var iobj = document.getelementbyid("btntestpost");
//btntestpost按鈕監(jiān)聽(tīng)的綁定
var clickrouter=new jsevent.eventrouter(iobj,"onclick");
clickrouter.addlistener(btntestpostclick);
}
function btntestpostclick()
{ // open參數(shù) url, onload, params, method, contenttype, onerror
cobj = new net.xmlhttp("defaulthandler.ashx",dealresult, "<t/>", "post");
}
/**//* post end*/
/**//* get begin*/
//綁定get發(fā)送xmlhttp事件到btntestget
function loadtestget()
{
var iobj = document.getelementbyid("btntestget");
//btntestget按鈕監(jiān)聽(tīng)的綁定
var clickrouter=new jsevent.eventrouter(iobj,"onclick");
clickrouter.addlistener(btntestgetclick);
}
function btntestgetclick()
{ // open參數(shù) url, onload, params, method, contenttype, onerror
cobj = new net.xmlhttp("defaulthandler.ashx?t=1",dealresult, null, "get");
}
/**//* get end*/
function dealresult()
{
var dobj = document.getelementbyid("divresult");
dobj.innerhtml = cobj.req.responsexml.text;
}
window.onload = function()
{
//綁定post發(fā)送xmlhttp事件到btntestpost
loadtestpost();
//綁定get發(fā)送xmlhttp事件到btntestget
loadtestget();
};
最后是.net處理xmlhttp的代碼
.net 處理xmlhttp請(qǐng)求
public class defaulthandler : ihttphandler
{
protected xmldocument _xmlresult;
public void processrequest(httpcontext context)
{
if (context.request["t"] != null)
{//get xmlhttp測(cè)試
context.response.contenttype = "text/xml";
xmldocument xmldoc = new xmldocument();
xmldoc.loadxml(string.format(@"<time>get:{0}</time>", system.datetime.now));
xmldoc.save(context.response.outputstream);
context.response.end();
}
else
{//post xmlhttp測(cè)試
context.response.contenttype = "text/xml";
xmldocument xmldoc = new xmldocument();
xmldoc.load(context.request.inputstream);
if (xmldoc.documentelement.name == "t")
{
xmldoc.loadxml(string.format(@"<time>post:{0}</time>", system.datetime.now));
xmldoc.save(context.response.outputstream);
context.response.end();
}
}
}
public bool isreusable
{
get
{
return false;
}
}
}
商業(yè)源碼熱門(mén)下載www.html.org.cn
新聞熱點(diǎn)
疑難解答
圖片精選