分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > IT知识

Jquery Ajax调用aspx页面方法

发布时间:2023-09-06 01:49责任编辑:彭小芳关键词:Ajax

在asp.net webform开发中,用jQuery ajax传值一般有几种玩法

1)普通玩法:通过一般处理程序ashx进行处理;

2)高级玩法:通过aspx.cs中的静态方法+WebMethod进行处理;

3)文艺玩法:通过WCF进行处理。

第一种和第三种方法不在本文介绍范围之内,下面重点介绍第二种方法。

说明

在我们的印象里 asp.net的Web服务是以.asmx来结尾的,而我们现在的asp.net也能实现Web服务,这是因为默认Web.config中已经添加了System.Web.Handlers.ScriptModule,它是用于管理asp.net中ajax功能的HTTP模块,这样不管用户是请求.asmx文件还是.aspx文件,都会通过此处理程序来处理请求。

后台代码:

using System.Web.Services; //引入命名空间[WebMethod]public static string SayHello(){ ???return "Hello Ajax!";}

前台页面代码:

<form id="form1" runat="server"><div> ???<asp:Button ID="btn" runat="server" Text="验证用户" /></div></form>

Javascript代码:

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

效果:

需要注意的地方

一、data参数写法

//1)普通写法,JSON键值对,如:单个参数的data:"{newsID:"+ id +"}",//多个参数的形式:data:"{newsID:"+ newsID +",name:"+ name +"}",//2)文艺写法:各种引号,双引号,单引号拼接,如//单个参数写法:data:"{‘name‘:‘"+ name +"‘}",//多个参数写法:data: "{‘content‘:‘" + $("#content").val() + "‘,‘createTime‘:‘" + $("#createTime").val() + "‘,‘creator‘:‘" + $("#creator").val() + "‘}"//容易出错!!!!!

二、用QueryString传值是后台取不到的问题

在WebMethod()方法中,是不能通过 HttpContext.Current.QueryString.Get("id")来获取query string,
因为在WebMethod()默认是用POST方法提交的,而用GetQueryString是不能取到值的。
替代方法是用JS获取url中的参数,用ajax提交给后台方法是用:
< script type = "text/javascript" > ???function getArgs(strParame) { ???????var args = new Object(); ???????var query = location.search.substring(1); // Get query string ???????var pairs = query.split("&"); // Break at ampersand ???????for (var i = 0; i < pairs.length; i++) { ???????????var pos = pairs[i].indexOf(‘=‘); // Look for "name=value" ???????????if (pos == -1) continue; // If not found, skip ???????????var argname = pairs[i].substring(0, pos); // Extract the name ???????????var value = pairs[i].substring(pos + 1); // Extract the value ???????????value = decodeURIComponent(value); // Decode it, if needed ???????????args[argname] = value; // Store as a property ???????} ???????return args[strParame]; // Return the object} < /script>

三、时间问题

WCF 或 模拟Web服务处理JSON时返回时间格式问题。解决方法如下:// 杂乱的时间var rawDate = "/Date(1347120000000+0800)/";// 提取时间字符串var strDate = rawDate.substr(6, 13);// 把时间字符串转化成int类型var intDate = parseInt(strDate);// 构造一个Date对象var newDate = new Date(intDate);// 将时间转化成当地时间格式var myDate = newDate.toLocaleDateString();// 最终结果alert(myDate);// 合并成一句var resultDate = new Date(parseInt("/Date(1347120000000+0800)/".substr(6, 13))).toLocaleDateString();

四、$.ajax参数详解

//标准的写法:$.ajax({ ????type: "post", ????dataType: "json", ????contentType: "application/json", //注意:WebMethod()必须加这项,否则客户端数据不会传到服务端 ????data:{如上所述},//注意:data参数可以是string个int类型 ????url: "List.aspx/DeleteNews",//模拟web服务,提交到方法 ????// 可选的 async:false,阻塞的异步就是同步 ????beforeSend:function(){ ?????????// do something. ?????????// 一般是禁用按钮等防止用户重复提交 ?????????$("#btnClick").attr({disabled:"disabled"}); ?????????// 或者是显示loading图片 ????}, ????success: function (data) { ?????????alert("success: " + data.d);//注意这里:必须通过data.d才能获取到服务器返回的值 ?????????// 服务端可以直接返回Model,也可以返回序列化之后的字符串,如果需要反序列化:string json = JSON.parse(data.d); ?????????// 有时候需要嵌套调用ajax请求,也是可以的 ????}, ????complete: function(){ ?????????//do something. ?????????$("#btnClick").removeAttr("disabled"); ?????????// 隐藏loading图片 ????}, ????error: function (data) { ?????????alert("error: " + data.d); ????}});

Jquery Ajax调用aspx页面方法

原文地址:https://www.cnblogs.com/NotEnough/p/8819433.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved