1. 程式人生 > >分頁---點選某一頁顏色發生改變

分頁---點選某一頁顏色發生改變

方法:

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>