自从有了JQuery,Ajax的使用变的越来越方便了,但是使用中还是会或多或少的出现一些让人短时间内痛苦的问题。本文暂时总结一些在使用JQuery Ajax中应该注意的问题,如有不恰当或者不完善的地方,欢迎大家指正和补充。

本文将从Ajax请求aspx、ashx和asmx三种方式讨论。

首先看看请求aspx的情况

Aspx页面的Ajax请求可以有两种方式:

1、 通过使用get或者post方法,传递页面地址为url参数的值,并附带一些标记参数,直接请求。这种方式的Ajax被一些人誉为“假的Ajax”,表面上没有刷新页面,其实后台的执行情况和刷新 页面的效果是一样的。

其实这种情况也可以请求页面中的特定的方法,只要使用附带的参数去判断,就可以“请求”特定的方法了。

下面展示了使用两种不同的方法请求两个不同页面的情况,只是摘抄了代码,具体的详细代码可以在文章结尾下载。

前台:

// 直接请求页面的方式
        $(function () {
            /*
            $.get(
                "RequestPage.aspx",
                { "token": "ajax" },
                function (data) {
                $("#dataShow").text(data);
                }
            );*/
            $.ajax({
                type:"Post",
                url: "ResponsePage.aspx",
                // data: "{'token':'ajax'}",// 使用这种方式竟然无法传递参数,各位有知道原因的告诉一下啊。
                data:"token=ajax",
                success: function (data) {
                    $("#dataShow").text(data); 
                }
            });
        })

后台:

protected void Page_Load(object sender, EventArgs e)
{
  if (!this.IsPostBack)
   {
     if ((Request["token"]??"")=="ajax")
      {
         // 下面这些内从可以放在一个方法里,然后通过“token”标记去判断执行哪个方法。
                    Response.Write("我是直接请求aspx页面返回的文字!");
                    Response.End();
        }
     }
 }

以上请求返回值都是字符串也就是dataType为text或者html类型。

如果要是希望请求返回的数据是xml或者json格式的,该怎么办呢?

如果要是xml格式的,需要添加一句Response.ContentType=”application/xml”;还有一点要注意的是Write中的内容必须是可以解析为xml的字符串才可以,比如“<my>123</my>”是可以的,“123”是不可以的,因为返回的信息中responseXml等于null。如下图:

前台:

$.ajax({

type: "Post",
                url: "ResponsePage.aspx",
                //data: "{'token':'ajax'}",// 使用这种方式竟然无法传递参数,各位有知道原因的告诉一下啊。
                data: "token=ajax",
              //不需要指定contentType,因为指定后返回的是整个页面的html,不知道为啥,请求解答啊。
                dataType: "xml",
                success: function (data) {
                    alert(data);
                },
                error: function (d, c,e) {
                    alert(e);  
                }
            });

后台:

// 如果要是返回的响应为xml,则必须这样设置

Response.ContentType = "application/xml";
//如果要是返回的响应为xml,返回的字符串必须是可以被解析的xml文档格式。
Response.Write("<my>123</my>");
Response.End();

如果是为json格式的,后台代码中Response.ContentType=”application/json”这句可有可无,不影响返回的值。但是Response.Write中的值一定要是json格式的,否则会有Invalid Json格式的错误。

前台:

$.ajax({
                type: "Post",
                url: "ResponsePage.aspx",
                //data: "{'token':'ajax'}",// 使用这种方式竟然无法传递参数,各位有知道原因的告诉一下啊。
                data: "token=ajax",
              //不需要指定contentType,因为指定后返回的是整个页面的html,不知道为啥,请求解答啊。
                dataType: "json",
                success: function (data) {
                    alert(data);
                },
                error: function (d, c,e) {
                    alert(e);  
                }
});

后台:

//如果要是返回的响应为xml,则必须这样设置
Response.ContentType = "application/json";
//如果要是返回的响应为xml,返回的字符串必须是可以被解析的xml文档格式。
Response.Write(“[123]");

Response.End();

1、 请求aspx页面后台中的方法。

其实上面的直接请求页面的方法中也跟介绍了一种请求页面内方法的解决方案,那就是在前台的ajax中传递一个参数作为标记,比如上面的那个“token”,然后在后台的page_load里面判断token的值,根据值的不同执行不同的方法。下面要介绍的是直接执行页面后台中的方法。

(1)使用简便get或者post方法时,由于不能设置contentType和dataType所以即使请求的是页面中的方法,最后请求的还是当前页面,返回的值仍旧是当前页面的html内容。所以在请求        方法的时候,简便方法还是不合适的。

(2) 使用非简便方法时,不管是post还是get,如果dataType为xml、text、htm,最后返回的值仍旧是整个html页面的内容。所以如果要想到的值,还是设置dataType为“json”吧,不       要忘记还要设置contentType为“application/json;charset=utf-8”,不设置这个,json也是返不回来的。而且还必须保证后台的被请求的方法是static的,还有[webmethod]标         记,而且还必须是public的。

前台:

$.ajax({
type: "post",
                url: "RequestPage.aspx/RequestedMethod",
                contentType: "application/json;charset=utf-8",
                dataType: "json",
                success: function (res) {
                    alert("success:"+res.d); //注意这点后面要加个d才能获取字符串信息,至于为什么要加个d,你通过chrome看看返回的响应就知道了,O(∩_∩)O
                },
                error: function (xmlReq, err, c) {
                    alert("error:" + err);                }
            });

后台:

//需要被Ajax请求的后台方法
[WebMethod]
[ScriptMethod(UseHttpGet=true)] //如果要使用POST请求,去掉这个标记
public static string RequestedMethod()
{
   return "[123]";
}

直接使用post是没有问题的:

如果type改为“get”,则会出现“500内部错误”。错误信息为:{"Message":"尝试使用 GET 请求调用方法“RequestedMethod”,但不允许这样做。

解决方法就是在后方法上再加一个标[ScriptMethod(UseHttpGet=true)],ScriptMethod 在System.Web.Script.Services下.这样之后,就可以在前台通过Get方式请求了,但是如果加了这个标记之后,前台就不能用POST进行请求了。

请求asmxwebservice)的情况

请求webservice的时候,主要是请求webservice中的方法,在请求之前不要忘记了代码开头的那段取消注释的提示“// 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务,请取消对下行的注释。

// [System.Web.Script.Services.ScriptService]”

请求webservice中的方法的处理方式和请求aspx页面后台方法的处理方式类似,但也有一些不同。

被请求的webservice中方法的特点:

(1)   请求的方法必须是为public的。

(2)  方法必须有[WebMethod]标记。

(3) 如果想使用Get的方式请求,还要有[ScriptMethod(UseHttpGet=true)]标记。使用Get请求Webservice的方法的时候,只添加这个标记是不够的,还要修改Web.Config文件,让WebService支持Get方式请求,否则会出现 “因 URL 意外地以“/GetXmlByGet”结束,请求格式无法识别。“的错误。修改方法为:在System.web配置节下添加以下红色的内容:

<System.web>
……………
<webServices>
      <protocols>
        <add name="HttpGet"/>
        <add name="HttpPost"/>
      </protocols>
    </webServices>
</System.web>

(4) 请求xml数据类型的时候,要注意,如果方法返回的是string类型的,返回的xml格式是这样的:

如果方法返回的是字符串,则会把返回的字符串包装在<string>标签中返回。

比如以下方法请求后的返回值:

[WebMethod]

public string GetXmlByPost()
{
   return "我是通过Post方式请求返回的xml ";
}

返回值:

<?xml version="1.0" encoding="utf-8"?>

<string xmlns="http://tempuri.org/">我是通过Post方式请求返回的xml</string>

红色部分是被请求方法返回的字符串,其他是自动添加的,所以在前台中通过jquery获取数据的时候,应该$(res).find(”string”).text();

如果方法返回的是xmlDocument对象,则就是方法中构造的xml对象。

比如以下方法请求后的返回值:

// 使用Get方式请求xml,注意返回的字符串一定要是可以解析的xml格式。

[WebMethod]
[ScriptMethod(UseHttpGet = true)]
public System.Xml. XmlDocument GetXmlByGet()
{
   string xml = "<?xml version=\"1.0\" encoding=\"utf-8\"?><my>我是通过Get方式请求返回的xml</my>";
    System.Xml.XmlDocument doc = new System.Xml.XmlDocument();
   doc.LoadXml(xml);
   return doc;
}

返回的响应为:

<?xml version=\"1.0\" encoding=\"utf-8\"?><my>我是通过Get方式请求返回的xml</my>

此时就可以通过$(res).find(”my”).text()的方式取数据了。此时操作的完全是你自己构造的xml。

(5)   关于请求返回JSON需要注意的就是,返回的也是“[d:{}]”格式的数据,所在前台获取的时候,一定要加个”.d”,其他的和xml差不多了。

(6)    Text的类型的就不多说了。

请求ashx的情况

请求ashx的时候和直接请求apsx页的情况类似,毕竟都是通过response.Write(string)的方式返回数据的。

需要注意的地方是:context.Response.ContentType的值,根据dataType的值区分:

Text:“text/plain“;

XML:“application/xml“;

JSON:“application/json“.

dataType为xml的时候,response.Write(string)中的字符串一定要符合xml的格式,为json的时候,response.Write(string)中的字符串一定要符合json的格式为否则会出现解析错误,这个和aspx页是一样的。

如果要使用session的话,在handler的代码中添加System.Web.SessionState的引用,并让这个handler继承IRequiresSessionState接口,一定要继承这个接口,否则会出错的。

其实都是很基本的东西,总结一下,有不妥的地方欢迎大家指正。

排版比较差,大家将就着看吧。

/Files/acles/JQueryAjaxDemo.rar

=============================================

传送门: http://www.cnblogs.com/acles/articles/2385648.html

转载于:https://www.cnblogs.com/PLifeCopyDown/archive/2013/05/17/3084008.html

JQuery Ajax 在asp.net中使用总结相关推荐

  1. ajax调用asp.net,jQuery.ajax()调用asp.net后台方法(非常重要)

    http://www.cnblogs.com/zxhoo/archive/2011/01/30/1947752.html 用JQuery的$.ajax()可以很方便的调用asp.net的后台方法. 先 ...

  2. ajax拿table里的th值,Jquery Ajax 异步设置Table中某列的值

    可根据table中某列中的ID去改变某列的值! 只是参考,实际应用中不能这样做的,如果有很多行,频繁访问服务器,服务器是顶不住的! JS: $(document).ready(function () ...

  3. jq获取内容ajax传递数据库,使用php和jquery ajax从mysql数据库中获取数据

    我想使用php和jquery ajax从mysql数据库中获取数据." process.php"是连接到数据库并获取mysql数据的php文件.当它单独运行时它可以工作,但是当使用 ...

  4. jquery ajax xml attribute,获得jQuery ajax和asp.net webmethod xml响应工作

    我有一个asp.net WebMethod,它返回一个XmlDocument对象.我可以使用jquery ajax成功调用该方法,但似乎无法使函数成功(服务器端webmethod使用正确的参数调用,但 ...

  5. mvc jquery ajax方法,asp.net mvc-如何在jQuery $ .ajax()中将模型发送请求到MVC控制器方法...

    asp.net mvc-如何在jQuery $ .ajax()中将模型发送请求到MVC控制器方法 在使用以下代码进行自动刷新时,我假设执行发布后,模型将自动发送给控制器: $.ajax({ url: ...

  6. 使用jQuery.Ajax向ASP.NET MVC控制器Post数据

    jQuery自带了Ajax的函数,你可以使用它从远程服务器下载网页,但问题是,大部分Ajax都是通过GET这种方式与远程服务器交互的. 但如果你想通过Ajax向远程服务器传递数据呢?当然jQuery. ...

  7. webservers ajax,jQuery AJax调用asp.net webservers的实现代码

    aspx页面代码 .hover { cursor: pointer; /*小手*/ background: #ffc; /*背景*/ } .button { width: 150px; float: ...

  8. ajax firefox,Jquery ajax不在firefox中工作

    我的代码正在使用chrome,safari,但它不能在firefox中运行. 这是我的代码 $(document).ready(function () { $("#loginform&quo ...

  9. reactjs jquery ajax,如何在ReactJS中使用JQuery

    qq_遁去的一_1 您应该尝试避免在ReactJS中使用jQuery.但是,如果您真的想使用它,可以将其放在组件的componentDidMount()生命周期函数中.例如class App exte ...

最新文章

  1. pythonista3使用说明_pythonista3都能做什么
  2. [转][Java]尝试解决Java多行字符串的编辑问题
  3. Nginx的http块MIME-Type的使用
  4. php改成IP连接数据库,thinkphp,pdo连接数据库,host自动被替换成了本机ip
  5. Java Swing井字游戏
  6. C语言学习及应用笔记之四:C语言volatile关键字及其使用
  7. template标签_C++核心准则T.65:使用标签分发提供函数的不同实现
  8. 关于numpy mean函数的axis参数
  9. MySQL笔记(八)存储过程procedure
  10. 大数据之-Hadoop3.x_MapReduce_ReduceJoin案例需求分析---大数据之hadoop3.x工作笔记0128
  11. 数据遍历打印得小列子
  12. 利用python炒股talib_TaLib在股票技术分析中的应用
  13. 日期计算excel_在Excel中计算日期范围内的项目
  14. 工作能力强的人,都有哪些特点?
  15. CTF MISC解题思路BUUCTF MISC1-8刷题
  16. android手机病毒原理,安卓手机病毒的原理是什么
  17. SAP FI-CO应收应付重分类
  18. 向前欧拉公式 matlab_阻尼谐振子运动的欧拉数值解法
  19. LINUX系统程序设计中C/C++编程工具使用
  20. 接口限流算法及解决方案

热门文章

  1. Redis面试刁难大全
  2. oc76--NSMutableDictionary
  3. sqlsever 导入大数据sql文件
  4. 《团队软件过程(修订版)》—第1章1.5节TSPi过程
  5. mysql alter 语句用法,添加、修改、删除字段等
  6. P1830 轰炸III
  7. AlertDialog Unable to add window token null is
  8. 程序员的黑科技_用代码回复博客
  9. apk 反编译工具的使用
  10. 解锁windows phone 8以进行开发