jQuery 的异步方法与JSON

最新推荐文章于 2022-12-07 18:01:22 发布
最新推荐文章于 2022-12-07 18:01:22 发布
阅读量818 收藏
点赞数
分类专栏： jQuery 文章标签： jquery getjson function button ajax json
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/gt7466/article/details/6718153
版权
记录下Jquery的3个异步方法。
页面： 
<html >

<head>

    



<script src="js/jquery-1.3.min.js" type="text/javascript"></script>

        

<script>

function GetJson()

{

    $.getJSON('jQueryData.ashx',{flag:"GetJson"},

    function(data)

    {

        $.each(data,function(i){

            alert(data[i].name);

            alert(data[i].age);

        });

    });

}



function Get()

{

    $.get('jQueryData.ashx',{flag:"Get"},

    function(data)

    {

        alert(data);

    });

}



function Ajax()

{

    jQuery.ajax({

                url:"jQueryData.ashx",

                dataType:"get",

                cache:false, 

                data:{flag:"ajax"},

                async: false,

                error:function(){},

                success:function(htmlInfo){

                alert(htmlInfo);

                }

    });

}



</script>



</head>

<body>

    <form name="form1" method="post" action="test1.aspx" id="form1">

<div>

<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKLTUxMTcwNzgxMGRkF6FjsQKs8c6sxP+bTT3rQIZWpxk=" />

</div>



    <div>

        <input id="Button1" type="button" value="GetJson" οnclick="GetJson()" />

        <input id="Button2" type="button" value="Get" οnclick="Get()" />

        <input id="Button3" type="button" value="Ajax" οnclick="Ajax()" />

    </div>

    </form>

</body>

</html>

jQueryData.ashx代码： 
public void ProcessRequest (HttpContext context) {
        context.Response.ContentType = "text/plain";

        string flag = context.Request.QueryString["flag"].ToString();

        string backData = "";
        
        switch (flag)
        {
            case "GetJson":
                backData = "[{name:\"Tom\",age:25},{name:\"Jack\",age:32}]";
                //backData = "[{\"name\":\"Tom\",\"age\":25},{\"name\":\"Jack\",\"age\":32}]";
                break;
            case "Get":
                backData = "hello 2";
                break;
            case "ajax":
                backData = "hello 3";
                break;
        }
        context.Response.Write(backData);
    }

getJSON方法获取JSON格式的数据。get方法的数据要求没getJSON严格，可以进行一些字符串的传递。而jQuery.ajax其实是上面方法的原型，getJSON,get都是简写的jQuery.ajax.

值得一说的是，  jQuery 1.4 是用parseJSON()来解析返回的json数据的，因此上面适用于1.3的getJSON写法在1.4下会无法取得数据。
1.4下正常的JSON,要注意双引号：
 
backData = "[{\"name\":\"Tom\",\"age\":25},{\"name\":\"Jack\",\"age\":32}]";



GT7466
关注
专栏目录
jquery 异步请求数据的三种方式
12-20
$('#send_ajax').click(function () { var params = $('input').serialize(); //序列化表单的值 $.ajax({ type: "POST", contentType: "application/json;charset=utf-8", url: "WebServicetest.asmx/HelloWorld", data: "{username:'cccc'}", dataType: "json", success: function (data) { alert(data); alert(data.d); var json = null; json = eval('(' + data.d + ')') alert(json.username); }, beforeSend: function(x) { x.setRequestHeader("Content-Type", "application/json; charset=utf-8"); }, error: function(x, e) { alert(x.responseText); }, complete: function(x) { alert(x.responseText); } }); });
jQuery异步请求方法
wangyidasb的博客
04-27 1846
jQuery确实是一个挺好的轻量级的JS框架，能帮助我们快速的开发JS应用，并在一定程度上改变了我们写JavaScript代码的习惯。 废话少说，直接进入正题，我们先来看一些简单的方法，这些方法都是对jQuery.ajax()进行封装以方便我们使用的方法，当然，如果要处理复杂的逻辑，还是需要用到jQuery.ajax()的(这个后面会说到). 1. load( url, [data],
使用jQuery实现异步操作
♂戏子无情♂的博客
06-24 1644
1、 使用jQuery实现异步操作，实现不刷新页面对数据进行处理，并且返回想要的数据到页面 首先要先引用一个js文件 jquery.js 文件 jsp页面代码如下： $.getJSON ('/ Meet520 /ajax.action?id ='+id, //此处为请求访问的action function(json) { //json为后台返回的数据 } }); 以...
jquery发送ajax请求
wjm0519的博客
12-18 357
Ajax用于浏览器与服务器通信而无需刷新整个页面，服务器将不再返回整个页面，而是返回少量数据，通过JavaScript DOM更新一部分节点。期间数据传输可采用xml，json等格式，Ajax最早用于谷歌的搜索提示。 其实不刷新整个页面便可与服务器通信的方法有很多，比如Flash，Java applet，iframe等，但Ajax是目前最为常见的一种。 我们可以使用JavaScript扩展对象...
jQuery 异步无刷新删除，前台JS调用后台删除方法
05-08
用jQuery做的实现异步无刷新删除，在前台通过JS调用后台的删除方法，并使前台页面局部刷新。
jQuery异步获取json数据方法汇总
01-19
jQuery异步获取json数据有2种方式，一个是$.getJSON方法，一个是$.ajax方法。本篇体验使用这2种方式异步获取json数据，然后追加到页面。 在根目录下创建data.json文件： 代码如下: {  “one” : “Hello”,  ...
jQuery实现异步获取json数据的2种方式
01-21
通常来说，jQuery异步获取json数据有2种方式，一个是$.getJSON方法，一个是$.ajax方法。本文就来实现使用这2种方式异步获取json数据，然后追加到页面。 在根目录下创建data.json文件： { one : Hello, two : ...
jQuery Ajax异步处理Json数据详解
10-26
jQuery AJAX 是一种强大的异步数据通信技术，它允许我们在不刷新整个页面的情况下与服务器交换数据。在处理 JSON 数据时，jQuery 提供了便捷的方法来解析和操作这些数据。JSON（JavaScript Object Notation）是一种...
详谈 Jquery Ajax异步处理Json数据.
01-19
所谓的Ajax.... } 好了,现在我们谈谈前台Js怎么处理后台返回的数据吧,可利用Jquery处理返回的纯html,json,Xml等数据.这里我们演示返回返回的数据有string、集合(List<>)、类. 但都返回Json格式
jquery异步请求如何拦截
qq_30908729的博客
05-03 820
jquery异步请求拦截 解决方法：http://www.yayihouse.com/yayishuwu/chapter/1227
jQuery Ajax 实例 全解析
weixin_30432579的博客
09-16 149
jQuery确实是一个挺好的轻量级的JS框架，能帮助我们快速的开发JS应用，并在一定程度上改变了我们写JavaScript代码的习惯。 废话少说，直接进入正题，我们先来看一些简单的方法，这些方法都是对jQuery.ajax()进行封装以方便我们使用的方法，当然，如果要处理复杂的逻辑，还是需要用到jQuery.ajax()的(这个后面会说到). 1. load( url, [data], [ca...
jquery 常用异步请求（ajax,post,get）和json对象的遍历
快乐de馒头
04-17 1921
$(function(){ $("#but").bind("click",function(){ $.ajax({ type:"POST", url:"test.php",
异步请求的多种实现方法
qq_39056805的博客
06-04 2758
一、基于JavaScript的原生方法//创建XMLHttpRequest对象 var xhr; if (window.XMLHttpRequest) { //非IE6 xhr = new XMLHttpRequest(); } else { xhr = new ActiveXObject('Microsoft.XMLHTTP'); } xhr.open("get","servlet?nam...
jquery异步请求的四种方式
weixin_57726733的博客
05-28 834
jquery的异步请求四种方式： 第一种Ajax请求： 保存数据到服务器，成功时显示信息 $.ajax({ type: "POST", url: "some.php", data: "name=John&location=Boston", success: function(msg){ alert( "Data Saved: " + msg ); } }); 注释： type:（默认：“GET”），请求方式（“PO...
jQuery异步请求使用详解($.get/$.post/$.getJSON/$.ajax)
最新发布
雾林小妖的博客
12-07 6073
讲解jQuery中常见的异步请求$.get,$.post,$.getJSON,$.ajax如何发送请求及如何获取和解析后端返回的json类型的数据。
基于jQuery的异步请求方法
weixin_41780596的博客
03-02 5673
1.最原始的js ,new XMLHttpRequest();  //由于浏览器兼容的原因，代码复杂，多使用基于jQuery的异步请求方法（内部封装） function loadXMLDoc() {     var xmlhttp;     if (window.XMLHttpRequest)     {         // IE7+, Firefox, Chrome, Opera, Saf...
jQuery四种异步加载
weixin_30242907的博客
09-06 535
在页面开发的过程中，为了加快整体页面打开的速度，对于某局部的数据采用异步读取（Ajax技术）的方法获取，这一方法的应用极大地优化了用户的体验，优化了页面的执行。 1.jQuery中的load()方法加载HTML 在传统的JavaScript中，使用XMLHttpRequest对象异步加载数据；而在jQuery中，使用load()方法可以轻松实现获取异步数据的功能。 load(u...
jquery $.when()多个异步请求成功后再执行后续方法
热门推荐
qq_34369022的博客
03-01 1万+
$.when( $.ajax( "/page1.php" ), $.ajax( "/page2.php" ) ).done(function( a1, a2 ) { // a1 and a2 are arguments resolved for the page1 and page2 ajax requests, respectively. // Each argument is an arr...
jquery异步调用java方法_jQuery 中ajax异步调用的四种方式
weixin_32027491的博客
02-26 362
$(document).ready(function(){ //Jquery 页面加载事件，当页面加载之后首先执行这个方法//第一种Ajax请求$.ajax({type:"GET", //请求类型，有get,post等类型，和表单提交是一样的url:"Result.aspx", //请求处理的页面,就是说由那个页面捕获请求，同样这个路径可以换成ashx，一般处理程序data: "name=...
jQuery异步请求方法详解
"jQuery异步请求方法及其应用" 在JavaScript编程中，jQuery库提供了一种简单易用的方式来实现异步数据交互，使得网页无需刷新就能获取或更新服务器上的信息。本资源主要探讨了如何利用jQuery进行异步方式的请求，...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值