zoukankan      html  css  js  c++  java
  • 通过jQuery调用ASP.NET的AJAX

    传统上,在ASP.NET页面中实现AJAX的方法是拖放一个ScriptManager控件,并进行一系列的设置和相关编程。但事实上,这并不是理想的解决方案。使用jQuery来调用ASP.NET后台的方法来实现AJAX可以节省至少三次的服务器与客户端之间的通讯连接。

    要实现通过jQuery的AJAX来调用ASP.NET后台的方法并不复杂,可以通过一个简单的例子来说明。

    首先,在ASP.NET项目中添加一个Web服务(asmx)文件,假设命名为WebService.asmx,可以看到它后台自动生成以下代码:

    [WebService(Namespace ="http://tempuri.org/")]
    [WebServiceBinding(ConformsTo =WsiProfiles.BasicProfile1_1)]
    //若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务,请取消对下行的注释。
    //[System.Web.Script.Services.ScriptService]
    public class WebService :System.Web.Services.WebService {
        public WebService () {
            //如果使用设计的组件,请取消注释以下行
            //InitializeComponent();
        }
        [WebMethod]
        public string HelloWorld() {
            return "Hello World";
        }
    }

    可以看到,系统已经为使用者做了一个Web服务后台方法的示例,即HelloWorld方法。调用HellowWorld方法不需要任何参数,而调用成功后,就可以获得一个字符串为HelloWorld。

    接着,需要取消对[System.Web.Script.Services.ScriptService]这行的注释,使这个Web服务可以被AJAX脚本调用。然后可以通过编写jQuery代码调用这个方法:

    $.ajax({
     type: "POST",
     url: "WebService.asmx/HelloWorld",
     data: "{}",
     contentType: "application/json; charset=utf-8",
     dataType: "json",
     success: function(msg) {
        // 在此可以对获得的响应数据进行操作
     }
    });

    注意url的值为Web服务文件的路径后面需要加上“/”符号和调用的方法名称。若是这个方法需要有传入的参数,则可以写在data值中。比如调用test(string parameter)方法,data值需要设置为“{parameter:’传入的值’}”。

    使用Firefox运行测试,可以通过Firebug工具的Console控制台看到页面从服务器获得的相应:


    可以看到服务器已经将返回的结果自动格式化为了JSON对象。要输出这个返回的“Hello World”字符串,只需要在上面编写的jQuery $.ajax()方法中编写success方法为:

    function(msg){
       varresult = $.parseJSON(msg);
       alert(msg.d);
    }

    $.parseJSON()是jQuery框架中用于将字符串转变为JSON对象的一个非常有用的函数,也就是说服务器传回一个’{“d”:”Hello World”}’的字符串,通过这个函数,就可以将它转化为Javascript对象{d:”Hello World”},便于读取和操作。

  • 相关阅读:
    设置nginx中文件上传的大小限制度
    百度编辑器(ueditor)踩坑,图片转存无法使用
    帝国cms更换Ueditor编辑器上传图片加水印
    帝国cms7.5整合百度编辑器ueditor教程
    帝国CMS万能标签ecmsinfo介绍
    帝国CMS排行榜调用标签
    通过案例理解position:relative和position:absolute
    帝国CMS万能标签标题截取后自动加入省略号
    linux 安装字体
    Ecms7.5版CK编辑器保留word格式如何修改
  • 原文地址:https://www.cnblogs.com/jennieji/p/2748966.html
Copyright © 2011-2022 走看看