分页---点击某一页颜色发生改变

方法:

1.首先从后台传过来要显示的页数

self.render("backend/drill_question_query.html", myuser=self.admin, admin_nav=43, questions=questions, page=page, pagesize=pagesize, pages=pages)

2.然后在前端接受当前要显示的页数

<div style="display:inline;" class="fenye" data-dt="{{page}}" id="fenye">
    <a href="/admin/drill/questions?page={{ page-1 if page> 1 else 1 }}"><span>上一页</span></a>
    {% if pages < 10 %}
    {% for i in range(1,pages+1) %} <a href="/admin/drill/questions?page={{i}}"><span>{{i}}</span></a>{% end %}
    {% else %}
    {% for i in range(1,8) %} <a href="/admin/drill/questions?page={{i}}"><span>{{i}}</span></a>{% end %}
    <a href="/admin/drill/questions?page={{pages}}"><span>{{pages}}</span></a>
    跳转<input id="pager" style="display:inline;width:26px;height:20px;" class="form-control" onpropertychange="JumpPage()" onblur="JumpPage()">页
    {% end %}
    <a href="/admin/drill/questions?page={{ page+1 if page<pages else pages }}"><span>下一页</span></a>
</div>

3.在js中给a标签变颜色

<script>
    $(function() {
        // notice为当前第几页
        var page = $("#fenye").data("dt")
        var c = "/admin/drill/questions?page="+page
        page = page.toString();
        $("a span").each(function(i,item){
            console.log(typeof $(this).text())
            if($(this).text()==page){
                $(this).parent().css("color","#D200D2")
            }
        });
    })
</script>

猜你喜欢

转载自blog.csdn.net/qq_34802511/article/details/83143185