网创优客建站品牌官网
为成都网站建设公司企业提供高品质网站建设
热线:028-86922220
成都专业网站建设公司

定制建站费用3500元

符合中小企业对网站设计、功能常规化式的企业展示型网站建设

成都品牌网站建设

品牌网站建设费用6000元

本套餐主要针对企业品牌型网站、中高端设计、前端互动体验...

成都商城网站建设

商城网站建设费用8000元

商城网站建设因基本功能的需求不同费用上面也有很大的差别...

成都微信网站建设

手机微信网站建站3000元

手机微信网站开发、微信官网、微信商城网站...

建站知识

当前位置:首页 > 建站知识

jQueryAJAX如何实现调用页面后台方法

这篇文章给大家分享的是有关jQuery AJAX如何实现调用页面后台方法的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

创新互联建站专注为客户提供全方位的互联网综合服务,包含不限于网站设计、成都做网站、闽侯网络推广、小程序设计、闽侯网络营销、闽侯企业策划、闽侯品牌公关、搜索引擎seo、人物专访、企业宣传片、企业代运营等,从售前售中售后,我们都将竭诚为您服务,您的肯定,是我们最大的嘉奖;创新互联建站为所有大学生创业者提供闽侯建站搭建服务,24小时服务热线:18980820575,官方网址:www.cdcxhl.com

具体内容如下

1.新建demo.aspx页面。

2.首先在该页面的后台文件demos.aspx.cs中添加引用。

using System.Web.Services;

1).无参数的方法调用.
大家注意了,这个版本不能低于.net framework 2.0。2.0已下不支持的。
后台代码:

[WebMethod]   
public static string SayHello()   
{   
   return "Hello Ajax!";   
}

JS代码:

$(function() {   
  $("#btnOK").click(function() {   
    $.ajax({   
      //要用post方式   
      type: "Post",   
      //方法所在页面和方法名   
      url: "Demo.aspx/SayHello",   
      contentType: "application/json; charset=utf-8",   
      dataType: "json",   
      success: function(data) {   
        //返回的数据用data.d获取内容   
        alert(data.d);   
      },   
      error: function(err) {   
        alert(err);   
      }   
    });   
  
    //禁用按钮的提交   
    return false;   
  });   
});

页面代码:

  
  
       
  

运行效果如下:

jQuery AJAX如何实现调用页面后台方法

2).有参数方法调用
后台代码:

[WebMethod]   
public static string GetStr(string str, string str2)   
{   
  return str + str2;   
}

JS代码:

$(function() {   
  $("#btnOK").click(function() {   
    $.ajax({   
      type: "Post",   
      url: "demo.aspx/GetStr",   
      //方法传参的写法一定要对,str为形参的名字,str2为第二个形参的名字   
      data: "{'str':'我是','str2':'XXX'}",   
      contentType: "application/json; charset=utf-8",   
      dataType: "json",   
      success: function(data) {   
        //返回的数据用data.d获取内容   
         alert(data.d);   
      },   
      error: function(err) {   
        alert(err);   
      }   
    });   
  
    //禁用按钮的提交   
    return false;   
  });   
});

运行效果如下:

jQuery AJAX如何实现调用页面后台方法

3).返回数组方法
后台代码:

[WebMethod]   
public static List GetArray()   
{   
  List li = new List();   
  
  for (int i = 0; i < 10; i++)   
    li.Add(i + "");   
  
  return li;   
}

JS代码:

$(function() {   
  $("#btnOK").click(function() {   
    $.ajax({   
      type: "Post",   
      url: "demo.aspx/GetArray",   
      contentType: "application/json; charset=utf-8",   
      dataType: "json",   
      success: function(data) {   
        //插入前先清空ul   
        $("#list").html("");   
  
        //递归获取数据   
        $(data.d).each(function() {   
          //插入结果到li里面   
          $("#list").append("
  • " + this + "
  • ");            });               alert(data.d);          },          error: function(err) {            alert(err);          }        });           //禁用按钮的提交        return false;      });    });

    页面代码:

    
    
      

    运行结果图:

    jQuery AJAX如何实现调用页面后台方法

    jquery是什么

    jquery是一个简洁而快速的JavaScript库,它具有独特的链式语法和短小清晰的多功能接口、高效灵活的css选择器,并且可对CSS选择器进行扩展、拥有便捷的插件扩展机制和丰富的插件,是继Prototype之后又一个优秀的JavaScript代码库,能够用于简化事件处理、HTML文档遍历、Ajax交互和动画,以便快速开发网站。

    感谢各位的阅读!关于“jQuery AJAX如何实现调用页面后台方法”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!


    文章名称:jQueryAJAX如何实现调用页面后台方法
    URL标题:http://bjjierui.cn/article/jodgco.html

    其他资讯