Jquery异步请求数据实例

本文转载自： http://www.cnblogs.com/xingsoft-555/archive/2011/12/27/2304030.html 作者：Xingsoft-555 转载请注明该声明。

一、Jquery向aspx页面请求数据

前台页面JS代码：

            $( " #Button1 ").bind( " click ", function () {
                $.ajax({
                    type:  " post ",
                    url:  " default.aspx ",
                    data:  " name= " + $( " #Text1 ").val(),
                    success: function (result) {
                        alert(result.msg);
                    }
                });
            });

 

<input id= " Text1 " type= " text " value= ' 张三 '/>
        <input id= " Button1 " type= " button "  value= " 提交 " />

 

后台cs代码：

View Code

     protected  void Page_Load( object sender, EventArgs e)
    {
         if (Request[ " name "]!= null)
        {
            Response.ContentType =  " text/json ";
            Response.Write( " {\"msg\":\" "+Request[ " name "]+ " \"} "); // 将数据拼凑为Json
            Response.End();
        }
    }

二、Jquery向WebService页面请求数据

            $( " #Button2 " ).bind( " click " , function () {
                $.ajax({
                    type:  " post " ,
                    contentType:  " application/json " ,
                    url:  " WebService.asmx/HelloWorld " ,
                    data:  " {name:' "  + $( " #Text1 " ).val() +  " '} " ,
                    datatype:  " json " ,
                    success: function (result) {
                        alert(result.d);
                    }
                });
            });

 <input id="Button2" type="button"   value="向WebService提交" />

WebService代码

View Code

using  System;
using  System.Collections.Generic;
using  System.Linq;
using  System.Web;
using  System.Web.Services;

///   <summary>
///  Summary description for WebService
///   </summary>
[WebService(Namespace =  " http://tempuri.org/ " )]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
//  To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line. 
[System.Web.Script.Services.ScriptService]
public  class  WebService : System.Web.Services.WebService {

     public  WebService () {

         // Uncomment the following line if using designed components 
         // InitializeComponent(); 
    }

    [WebMethod]
     public  string  HelloWorld(  string  name) {
         return  " Hello World " +name;
    }
    
}

 

三、Jquery向ashx请求数据和向页面相同

Js代码：

             $( " #Button3 " ).bind( " click " , function () {
                $.ajax({
                    type:  " post " ,
                    url:  " Handler.ashx " ,
                    data:  " name= "  + $( " #Text1 " ).val(),
                    success: function (result) {
                        alert(result.msg);
                    }
                });
            });

后台代码:

View Code

<%@ WebHandler Language= " C# " Class= " Handler " %>

using System;
using System.Web;

public  class Handler : IHttpHandler {
    
     public  void ProcessRequest (HttpContext context) {
        context.Response.ContentType =  " text/json ";
        context.Response.Write( " {\"msg\":\"Hello World "+context.Request[ " name "]+ " 来自handler.ashx\"} ");
        context.Response.End();
    }
 
     public  bool IsReusable {
         get {
             return  false;
        }
    }

}

代码下载