jq的分页获取对应当前对象的id

ajax的页面渲染

 //查询数据
        function search(curr, name) {

            var name = $("#scenery-name").val();

            // 分页的条数和页数
            var str = "";
            var pageSize = 5;
            if (curr == 0) {
                var curr = 1;
            }
            $.ajax({
                type: "post",
                url: "http://localhost:8081/scenery/list",
                dataType: "json",
                async: false,
                data: { "page": curr, "limit": pageSize, "name": name },
                success: function (res) {
                    var returndata = res.data;
                    // 模糊查询先清空原有的数据
                    $(".list-wrap").text("");

                    $(returndata).each(function (index, item) {
                        var code = '<div class="item">'
                        code += '<a  target="_blank">'
                        code += '<div class="item-image">'
                        code += '<img src="http://localhost:8081' + item.sceneryImg + '">'
                        code += '</div>'
                        code += '<div class="detail">'
                        code += '<div class="info">'
                        code += '<p>' + item.name + '</p>'
                        code += '<h3>'
                        code +=
                            '【千人好评-下单减500】新疆喀纳斯8天结伴游(禾木住宿-豪华西域风情酒店-西域风情特色餐-经典景点全含-赠旅行百宝箱-免费接送)'
                        code += '</h3>'
                        code += '<div class="tag"></div>'
                        code += '<p class="time">开放时间:' + item.sceneryTime + ' | 景区星级: ' + item.grade + '</p>'
                        code += '<p>地址:' + item.address + '</p>'
                        code += '</div>'
                        code += '<div class="extra">'
                        code += '<div class="price">'
                        code += '<b>¥</b>'
                        code += '<strong>' + item.ticket + '</strong>'
                        code += '起'
                        code += '</div>'
                        code += '<div class="promo-txt">'
                        code += '<em>促销</em>'
                        code += '每2人减200'
                        code += '</div>'
                        code += '<div class="discount-tag">券</div>'
                        code += '<div class="discount-tag vip-discount">金卡专享</div>'
                        code += '</div>'
                        code += '<div class="action">'
                        code += '<span id="'+item.id+'" class="btn" >查看详情</span>'
                        code += '</div>'
                        code += '</div>'
                        code += '</a>'
                        code += '</div>'

                        $(".list-wrap").append(code);

                        var pages = res.pages;  //总页数
                        // var curr = res.pageNum;    //当前页
                        laypage({
                            cont: 'doctorDiv',  //分页需要显示的地方
                            pages: pages,    //总页数
                            curr: curr || 1, //当前页
                            groups: 8,//连续显示分页数
                            skip: true,     //是否开启跳页
                            first: '首页',
                            last: '尾页',
                            skin: 'molv',   //加载内置皮肤,也可以直接赋值16进制颜色值,如:#c00
                            prev: '<', //若不显示,设置false即可
                            next: '>', //若不显示,设置false即可
                            jump: function (e, first) { //触发分页后的回调
                                if (!first) { //一定要加此判断,否则初始时会无限刷新
                                    $(".list-wrap").text("");
                                    search(e.curr, e.name);
                                }
                            }
                        });
                    });

                }
            });


        }

jq获取对应的id

    <script type="text/javascript">
        //进入到详情页面
        $(document).on('click',".btn",function(){
            var sceneryId=$(this).attr("id")
            console.log(sceneryId)
        })
    </script>

 

posted @ 2021-12-28 14:42  java璀璨小菜鸟  阅读(112)  评论(0)    收藏  举报