设置 isTable: 1 显示为 table 格式,设置 headerRow 回调生成表头
示例代码:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
var DEFAULT_IMAGE = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAMAAADzN3VRAAAAk1BMVEUAAAD////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////ROyVeAAAAMHRSTlMA3remQMMv+eu2RzznyrysmJNlRA8G7+TVv7KnooyEelopIxMK4F5JNAH284d0VR38f9wYAAAA2UlEQVQoz52Q6Q6CMBCEC7a2pdy3HIKA99X3fzq3+EMQSIybdLLNl53MLvq5oizRnrPESBt7M0tKgsR1N2e2vyPM5oindci1zlOwlRg1tJ6CSj5QVFhTgKUP4dipC8MvYusgR9PJuF210HY4CAID4vhSwPdce+XW3audcmoyxlLjQKvPeJuA0IPAWDiSekPnHJ7W9osQMTpSrMhJtY47jmkqslbtajXOSZaIry0RwpfI7eOWF0MQWkVPptmOMgA1w/7+cT0MIBvQOM10ricbi3D9Xdy+lBH6p15BIw0F5vgmRQAAAABJRU5ErkJggg==';

var cdList = window.cdlist = new CdList({
  tableClass: 'amap-table',

  // 设置以 table 形式展示
  isTable: 1,

  getUrl: function (data) {
    var param = {
      key: '6a8449ec9b2da3fcff320383bfc69e92',
      extensions: 'all',
      city: 'beijing',
      offset: 10
    };
    return 'https://restapi.amap.com/v3/place/text?' + $.param(param);
  },

  empty: function () {
    return '<div class="amap-list-empty">抱歉,没有您查找的 POI </div>'
  },

  getAjaxData: function (url) {
    return $.ajax({
      url: url,
      dataType: 'jsonp'
    });
  },

  headerRow: function () {
    return '<tr><th>名称</th><th>地址</th><th>图片</th></tr>'
  },

  rows: function (item) {
    var html = ['<tr>',
      '<td class="item-name">' + item.name + '</td>',
      '<td class="item-address">' + item.address + '</td>',
      '<td class="img">',
        '<img src="' + (item.photos[0] && (item.photos[0].url + '?operate=merge&w=160&h=150&position=5') || DEFAULT_IMAGE) + '">',
      '</td>',
    '</tr>'].join('');

    return html;
  },

  getRowsData: function (json) {
    return json.pois;
  }
}, '#cdlist-wrap');

cdList.getList();