jquery+ajax+ashx
轉自:http://www.cnblogs.com/myaspnet/archive/2010/11/12/1876101.html
?
1、使用一般的webform,在頁面用jQuery ajax調用,再從取得的html數據中取得<body>內的內容,寫入DOM
優點:不用改變現有的asp.net開發模式,可以使用現成的頁面;ajax取得的內容是html文本,直接寫入DOM即可?
缺點:內容浪費,<body>之外的內容都不是必要的,而且如果使用了MasterPage那就。。。
2、使用一般的webform,但是用Response.Write()控制輸出html,在頁面用jQuery ajax調用,將獲取的內容寫入DOM
優點:內容干凈,不浪費;ajax取得的內容是html文本,可以直接寫入DOM?
缺點:需要在服務器端以字符串形式構造html文本,編程不方便,不容易調試和維護
3、使用一般的webform,用Response.Write()控制輸出json數據,在頁面用jQuery ajax調用,將json數據在客戶端加工成html后寫入DOM
優點:僅僅交換json數據,極干凈,符合高效的web設計理念?
缺點:需要在客戶端加工json數據,并且對DOM造成入侵
4、使用asmx,封裝成web service,用jQuery ajax調用asmx的內容,將json或者xml數據在客戶端加工成html后寫入DOM?
優點:僅僅交換json或/xml數據,非常干凈;web service易于跨平臺?
缺點:需要在客戶端加工json數據,并且對DOM造成入侵
5、使用自定義控件ascx,然后使用專門的webform頁面做wrapper(包裝)在頁面用jQuery ajax調用wrapper webform,將html數據寫入DOM
優點:webform僅僅用作wrapper,根據不同的請求參數可以在wrapper中動態使用自定義控件;自定義控件輸出的是html文本,可以直接寫入DOM;編程方便,有VS2008代碼感知支持,易于調試和維護?
缺點:跟傳統的webform編程理念不一樣,弱化了webform的作用
以上就是討論的幾種可行的方案——不管是asp.net webform方式還是asp.net MVC方式,都是可行的。
昨天晚上又發現一種方案:使用ashx+jQuery .ashx是一個專門的用于處理HttpHandler的文件類型,用來處理自定義Http請求,可以在web.config定義運行時針對ashx的Http請求處理方式。
<add verb="*" path="*.ashx" type="System.Web.UI.SimpleHandlerFactory" validate="false" />
這樣我們就可以用SimpleHandlerFactory來處理ashx的http請求了。在ashx的類中實現IRequiresSessionState接口,using下System.Web.SessionState就可以使用Session了,很方便
using System.Web.SessionState;?????
public class checkCookie : IHttpHandler,IRequiresSessionState?
{???
???? ...??// todo somthing?
}
實例:使用ashx+jQuery實現Email存在的驗證?
.ashx文件?
<%@ WebHandler Language="C#" class="CheckUser" %>
using System;using System.Web;???
public class CheckUser : IHttpHandler?
{?
???? public void ProcessRequest (HttpContext context)?
????{??????
??????????context.Response.ContentType = "text/plain";?
??????????context.Response.Write(UserRule.GetInstance().IsUserExist(context.Request["Email"]));?
????}?
???? public bool IsReusable?
????{?
???????? get {?
????????????return false;?
????????}?
????}?
}
html:?
<input?type="text" id="email" />?
<input?type="button" value="test" οnclick="check_email()" />
js:?
function?check_email()?
{?
????var?email = $("#email").attr("value");?
???? $.get("../ajax/checkuser.ashx",?
????{ Email: email },?
?????function(data)?
???? {?
????????window.alert(data);?
??????});?
}
simple的,顯然效率會比較高。不過simple的就只能夠做點simple的事情。如果要輸出html,還是不太方便。如果要輸出html的話,我還是比較傾向于用ascx處理內容,webform做包裝所以 ashx+jQuery應該算是是一個asp.net里輕量級的解決方案
asp.net中jQuery $post用法
函數原型:$.post(url,params, callback)??
url是提交的地址,eg:?"sample.ashx"
params是參數,eg:?{ name:"xxx" , id:"001" }
callback是回調函數,eg:?function(msg){ alert(msg); }
注意1:在sample.ashx那段,使用context.Request["id"]和context.Request["name"]來分別獲得值"001"和值"xxx",而不是使用context.Request.QueryString["id"]
注意2:這里的callback里的函數是在服務器返回值后被觸發,所以不需要另行判斷xmlHttp.readyState==4 &&xmlHttp.status==200
接下來,我們來用一段代碼比較一下$.post方式和原始的xmlHttp方式
為了更好的對應,我讓2個方式實現一樣的功能,傳的值和回調函數的名字一樣
/* xmlHttp方式 */
?? var xmlHttp;??? //定義對象xmlHttp
????functioncreateXMLHttpRequest()??????? //創建xmlHttpRequest的函數
??? {
if(window.ActiveXObject)
{
xmlHttp = new ActiveXObject( "Microsoft.XMLHTTP" );
}
else if(window.XMLHttpRequest)
{
xmlHttp = newXMLHttpRequest();??????????????
}
}
??? function btn_onclick()????? //假設一個button點了以后觸發這個ajax
{
createXMLHttpRequest();
var url="sample.ashx?id=1&name=a";??? //這里假設傳給sample.ashx,傳2個值,id=1和name=a
???????xmlHttp.open( "POST" ,url,true);
xmlHttp.onreadystatechange=Response; //回調函數是Response()
???????xmlHttp.send(null);???
}
?? functionResponse()
{
if( xmlHttp.readyState==4 && xmlHttp.status==200 )
{
alert( xmlHttp.responseText );?????? //彈出一個框顯示服務器返回的內容
????????}
}
/* $.post方式 */
function btn_onclick()????? //同樣還是這個事件和函數,還是點了以后觸發
??{??????
/*
同樣還是sample.ashx,同樣是id=1&name=a
這里的function(msg)是回調的函數,你可以把執行的內容直接寫在{}里,msg表示服務器返回的數據。
為了和上面的方式更好的對應起來,我這里依然讓他調用Response,但是需要增加參數msg
*/?
$.post("sample.ashx",{ id:"1",name:"a" }, function(msg){ Response(msg); });???
??? }
?? function Response(msg)
{
alert( msg );?????? //彈出一個框顯示服務器返回的內容
??? }
?
jquery+ajax+asp.net實現Ajax操作
轉載?2010-05-17 01:46:41閱讀143 評論0 字號:大中小
文章簡介:關于jquery+ajax+asp.net實現Ajax操作的簡介
jquery,ajax,asp.net
是jquery+ajax+ashx的?? 現在這個是Handler.ashx:
========================================================================
<%@ WebHandlerLanguage="C#" class="Handler" %>
using System;
using System.Web;
...jquery+ajax+asp.net實現Ajax操作
是jquery+ajax+ashx的?? 現在這個是Handler.ashx:
========================================================================
<%@ WebHandlerLanguage="C#" class="Handler" %>
using System;
using System.Web;
public class Handler :IHttpHandler {
?
????publicvoid ProcessRequest (HttpContext context) {
????????charmethod = Convert.ToChar(context.Request.Params["m"]);
????????context.Response.ContentType= "text/plain";
????????switch(method)
????????{
????????????case'a':
????????????????context.Response.Write("HelloWorld<br/>This is a sample");
????????????????return;
????????????case'b':
????????????????context.Response.Write("HelloWorld<br/>This is b sample");
????????????????return;????????????????
????????}
????????context.Response.Flush();??
????}
}
================================================================
jquery調用代碼:
=================================================================
$(document).ready(function(){
????????????$("#test2").click(function(){
????????????????$.ajax({
????????????????????type: "post",
????????????????????url: "Handler.ashx",
????????????????????data: {m:'a'},
????????????????????success: function(result){
????????????????????????$("#testText").append(result+ "<br/>");
????????????????????}
????????????????});
????????????});
????????});
????????$(document).ready(function(){
????????????$("#test3").click(function(){
????????????????$.ajax({
????????????????????type: "post",
文章簡介:關于jquery+ajax+asp.net實現Ajax操作的簡介
jquery,ajax,asp.net
是jquery+ajax+ashx的?? 現在這個是Handler.ashx:
========================================================================
<%@ WebHandlerLanguage="C#" class="Handler" %>
using System;
using System.Web;
...jquery+ajax+asp.net實現Ajax操作
是jquery+ajax+ashx的?? 現在這個是Handler.ashx:
========================================================================
<%@ WebHandlerLanguage="C#" class="Handler" %>
using System;
using System.Web;
public class Handler :IHttpHandler {
?
????publicvoid ProcessRequest (HttpContext context) {
????????charmethod = Convert.ToChar(context.Request.Params["m"]);
????????context.Response.ContentType= "text/plain";
????????switch(method)
????????{
????????????case'a':
????????????????context.Response.Write("HelloWorld<br/>This is a sample");
????????????????return;
????????????case'b':
????????????????context.Response.Write("HelloWorld<br/>This is b sample");
????????????????return;????????????????
????????}
????????context.Response.Flush();??
????}
}
================================================================
jquery調用代碼:
=================================================================
$(document).ready(function(){
????????????$("#test2").click(function(){
????????????????$.ajax({
????????????????????type: "post",
????????????????????url: "Handler.ashx",
????????????????????data: {m:'a'},
????????????????????success: function(result){
????????????????????????$("#testText").append(result+ "<br/>");
????????????????????}
????????????????});
????????????});
????????});
????????$(document).ready(function(){
????????????$("#test3").click(function(){
????????????????$.ajax({
????????????????????type: "post",
????????????????????url: "Handler.ashx",
????????????????????data: {m:'b'},
????????????????????success: function(result){
????????????????????????$("#testText").append(result+ "<br/>");
????????????????????}
????????????????});
????????????});
????????});
????????????????????url: "Handler.ashx",
????????????????????data: {m:'b'},
????????????????????success: function(result){
????????????????????????$("#testText").append(result+ "<br/>");
????????????????????}
????????????????});
????????????});
????????});
己雖然以前也用ajax但總感覺那里覺得不對,以前ajax都是請求aspx頁面,那頁面多的數不清,自己也覺得很亂。
自己最近在工作中,也覺得同事用的jquery+ashx用起來相當的簡潔方便。幫在這里做了一個小的demo來
<%@ Page Language="C#"AutoEventWireup="true" CodeFile="AjaxGet.aspx.cs"Inherits="AjaxGet" %>
<!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>無標題頁</title>
?? ?<scripttype="text/javascript" src="misc/js/jquery-1.2.6.js"></script>
</head>
<body>
<script type="text/javascript"language="javascript">
?function GetCategoryData(type)
?{
?alert("test start");
??$.ajax({
??type:'GET',
??url:'AjaxService/Handler.ashx',
??dataType: 'text',
??data:'type='+type,
??success:function(msg)
??{
??alert(msg);
??$("#category").html(msg);
??},
??error: function(data){
??alert(data);
??}
??})
?}
</script>
?? ?<form id="form1"runat="server">
?? ?<div>
?? ?<input type="radio"value="1" name="wangtao"?οnclick='GetCategoryData(this.value)' />
?? ?<input type="radio"value="2" name="wangtao" οnclick='GetCategoryData(this.value)'/>
?? ?<select id="category" >
?? ?</select>
?? ?</div>
?? ?</form>
</body>
</html>
前臺頁后很簡單了,就是兩個radio和一個select。要把選中的radio的值放在select中去。
后臺ashx代碼
<%@ WebHandler Language="C#"Class="Handler" %>
using System;
using System.Web;
using System.Text;
public class Handler : IHttpHandler {
?? ?public void ProcessRequest (HttpContextcontext) {
?? ? ? ?StringBuilder strBul = newStringBuilder();
?? ? ??strBul.Append("<option value='wangtao'>");
?? ? ? ?strBul.Append(context.Request.Params["type"].ToString());
?? ? ??strBul.Append("</option>");
?? ? ??context.Response.ContentType = "text/html";
?? ? ??context.Response.Write(strBul.ToString());
?? ?}
?? ?public bool IsReusable {
?? ? ? ?get {
?? ? ? ? ? ?returnfalse;
?? ? ? ?}
?? ?}
}
雖然很簡單,但可以供大家舉一反三。
轉載于:https://www.cnblogs.com/Rising/archive/2013/04/10/3013328.html
總結
以上是生活随笔為你收集整理的jquery+ajax+ashx的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 恶心的Oracle的if else if
- 下一篇: webstorm 注册码,亲测可用