专注于网站技术与网络营销的博客

赞助商链接

« 在ASP.NET2.0中上传多个文件微软发布ASP.NET MVC 1.0 »

ASP.Net中基于jQuery的jMsAjax

      jMsAjax是一套基于jQuery改进了的简单包装插件,实现对ASP.Net的Ajax完整功能支持。插件同时实现了Web方法和Web服务的GET和POST的请求。

官方提供的使用方法:
Defaults:
type: "POST"
data: {}
dataType: "msjson"
error: function to return the status and message

 

Basic Usage:
$.jmsajax({
   url: "jMsAjax.aspx",
   method: "getTime",
   success: function(data) {
      $("#div").html(String(data));
   }
});

 

Advanced Usage:
$.jmsajax({
   type: "POST",
   url: "jMsAjax.aspx",
   method: "getTime",
   dataType: "msjson",
   data: { date_in: new Date() },
   success: function(data) {
      $("#div").html(String(data));
   }
});

 

实验步骤:

  1. 使用Visual Studio 2008新建项目(.Net  Framework选择3.5)
  2. 下载jQuery和jMsAjax,并在项目中添加两个js文件的引用
  3. 在Default.aspx设计器中添加:

    <div>

            姓名: <input id="UserName" type="text" size="15" runat="server" />
            <br />
            <br />
            城市: <input id="UserCity" type="text" size="15" runat="server" />                   
            <br />
            <br />
        <input id="btnAspx" type="button" value="提交" />
    </div>
    <div id="div1"></div>

  4. 添加Js方法
    <script type="text/javascript">
        $(function()

        {

            $("#btnAspx").click(function()

            {

                $.jmsajax({

                url: "Default.aspx",

                method: "GetTest",

                data:

                {

                    UserName: $("#UserName").val(),

                    UserCity: $("#UserCity").val()

                },

                success: function(data)

                {

                    $("#div1").html(String(data));

                }

                });

            });

        });
    </script>

  5. 后台代码 Default.aspx.cs中添加方法

    [System.Web.Script.Services.ScriptMethod(ResponseFormat = System.Web.Script.Services.ResponseFormat.Json)]
    [System.Web.Services.WebMethod]
    public static string GetTest(string UserName, string UserCity)
    {

        return UserName + "," + UserCity  +   "         现在时间:" + DateTime.Now.ToString();

    }

 

相关链接:

Example源程序下载

jMsAjax官方网站

jQuery官方网站

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

Powered By Z-Blog 1.8 Arwen Build 81206

Copyright 2005 - 2009, 完美生活(专注于网站技术与网络营销的博客). Some Rights Reserved.