jQuery's method of calling jSon data and displaying it

jQuery's method of calling jSon data and displaying it_jquery

WBOY

Release： 2016-05-16 16:17:05

Original

1452 people have browsed it

The example in this article describes how jQuery retrieves jSon data and displays it. Share it with everyone for your reference. The details are as follows:

The following code is the display part of the page

Copy code The code is as follows:

function searchProductlistByfilterCondition(index, type, sort, filterWord) {
//cite_html
var citem_html = '

'
+ '

'
+ '{title}

'
+ '{time}'
+ '

'
+ '

'
+ '{mark} {price}'
+ '{praise}

'
+ '

'
+ '{user}

'
                    + '( 转载- '
                    + ' 站酷中国 )'
                    + '

'
+ ''
+ '

'
+ ' 小海藻福建福州 '
+ ' 人气：256

'
                    + ' '
                    + ' 加关注 '
                    + ' 发私信

'
+ '

'
+ ' '
+ '

'
+ '

';
    $.get('ajax/getProductListByFliterCondition.ashx',
     { pageIndex: index, Type: type, Sorting: sort, keyWord: filterWord }, function (data) {
         $.each(data.jsona, function (index, elem) {
             citemHtml = citem_html.replace('{imgList}', elem.msg_img_list).replace('{title}', elem.msg_title)
                                    .replace('{time}', elem.msg_date).replace('{mark}', elem.msg_mark)
                                    .replace('{price}', elem.msg_price).replace('{praise}', elem.msg_praise)
                                    .replace('{user}', elem.msg_create_user);
         })
         $("#fsD1").after(citemHtml);
     }, 'json');
    //alert(sort);
}

citem_html：页面代码（关键字用特殊符号和文字表示，例如 {imgList}，（time）等）

$.get()：从指定的资源请求数据

第一个参数：jSon插件；第二个参数：json数据格式；第三个参数：function（data）方法，data为取得的json数据串

$.each(data.jsona,function(index,elem))
参数说明：
data.jsona：json数据

function(index,elem)：
参数说明：
index：索引
elem：相当于json数据串

此后，将html代码添加到页面中。

此方法的作用：
1、传递参数
2、获取
3、展示

接下来在

复制代码代码如下:

$(function () {  

    //页面初始化调用  

    searchProductlistByfilterCondition("", "", "", "");  

    //查询框，关键字查询--调用函数  

    $('#search ').click(function () {  

        pageIndex = 1;  

        searchProductlistByfilterCondition(pageIndex, sortP, typeL, keyWord);  

          });  

}

页面js中，调用，只需要将具体的数据对应填上就可以了。

页面中的js作用：
1、绑定
2、赋值

希望本文所述对大家的jQuery程序设计有所帮助。