Jquery 中 $.getJSON的用法

之前类似的方法用过 $.post， $.get，$.ajax，还是第一次用这个 $.getJSON。

前三个都是用作异步请求的，那么最后一个呢？其实也是异步请求的，和 $.get 最类似，因为他也是将数据放在了 url上面。

代码：

// 页面一加载就请求服务器，获取当前用户的笔记本数据

function loadPageNotebooks() {

    var page = $(document).data('page');

    var userId = getCookie('userId');

    var url = 'notebook/page.do';

    var data = {

        userId : userId,

        page : page

    };

    // 从服务器拉取数据

    $.getJSON(url, data, function(result) {

        console.log(result);

        if (result.state == 0) {

            var notebooks = result.data;

            showPageNotebooks(notebooks, page);

            $(document).data('page', ++page);

        } else {

            alert(result.message);

        }

    });

}

后台代码：

    /**

     * 获取当前用户的全部笔记本，以json的形式响应回去

      * @param userId

     * @param page

     * @return

     */

    @RequestMapping("/page.do")

    @ResponseBody

    public Object page(String userId, Integer page) {

        List<Map<String, Object>> list = notebookService.listNotebooks(userId, page);

        return new JsonResult(list);

    }

小总结：

$.getJSON() 是专门为 ajax 获取 json 数据而设置的，并且支持"跨域"调用，其语法的格式为：

getJSON( url , [data] , [callback] )

其中三个分别为：

url：string类型，发送请求地址

data ：可选参数，待发送 Key/value 参数，同 get，post 类型的 data

callback ：可选参数，载入成功时回调函数，同 get，post 类型的 callback

JSON 是一种理想的数据传输格式，它能够很好的融合与 JavaScript 或其他宿主语言，并且可以被 JS 直接使用。使用 JSON 相比传统的通过 GET、POST 直接发送“裸体”数据，在结构上更为合理，也更为安全。至于 jQuery 的 getJSON() 函数，只是设置了 JSON 参数的 ajax() 函数的一个简化版本。这个函数也是可以跨域使用的，相比 get()、post() 有一定优势。另外这个函数可以通过把请求 url 写成 "myurl?callback=X" 这种格式，让程序执行回调函数X。
注：

数据最终还是通过 url 后面通过 get 方式发送数据出去的，这就决定了，发送的 data 数据量不能太多【get方式最大4KB】，否则造成 url 太长接收失败（getJSON方式是不可能有post方式递交的）。

巴特西

Jquery 中 $.getJSON的用法

最新文章

热门文章