jquery click Load More

html part

  <ul class="bill moreadd">
        <div class="total"><span>-</span><span>23756.177</span></div>
<li>
<div class="left">
<p class="type">0.01000</p><p class="time">2019-06-14 15:58:59</p>
</div>
<div class="right">签到成功</div></li><li>
<div class="left"><p class="type">0.01000</p><p class="time">2019-06-14 15:58:59</p>
</div>
<div class="right">签到成功</div></li><li><div class="left"><p class="type">0.01000</p><p class="time">2019-06-14 15:58:59</p></div><div class="right">签到成功</div>
        </li>
        <li>
<div class="left">
                <p class="type">0.01000</p>
                <p class="time">2019-06-14 15:58:59</p>
            </div>
            <div class="right">签到成功</div>
        </li>
<span class="hljs-tag">&lt;/<span class="hljs-name">ul</span>&gt;</span>

< Span class = "More" Data-Total = ". 3" Data-Page = ". 1" > Load more </ span >
$('.more').on('click', function () {
            var baseurl = $('#baseurl').val();
            var type = $.trim($(this).attr('data-type'));
            var total = parseInt($(this).attr('data-total'));
            var page = parseInt($(this).attr('data-page'));
            $.ajax({
                url: './lib/js/more' + page + '.json',
                type: 'get',
                dataType: "json",
                data: { page: page + 1 },
                success: function (res) {
                    var result = '';
                    // console.log(res.lists)
                    var list = res.lists
                    $('.more').attr('data-page', page + 1);
                    for (var i = 1; i < list.length; i++) {
                        console.log(res.lists[i])
                        result += '<li>'
                            + '<div class="left">'
                            + '<p class="type">' + res.lists[i].price + '</p>'
                            + '<p class="time">' + res.lists[i].date + '</p>'
                            + '</div>'
                            + '<div class="right">' + res.lists[i].name + '</div>'
                            + '</li>'
                    }
                    $('.moreadd').append(result);
                <span class="hljs-keyword">if</span> (page + <span class="hljs-number">1</span> == total) {
                    $(<span class="hljs-string">'.more'</span>).remove();
                }
            }
        });
    });

note

more.json here is a local test data, so the incoming page is more1.json more2.json into the interface, then, in accordance with normal to it.

Guess you like

Origin www.cnblogs.com/mica/p/11162528.html