.Net MVC中HTML分頁頁碼展示實現效果邏輯

具體效果和 這篇文章裏面一樣:【查看地址

@{
    var pageCount = 3;
    var NowNumber = Convert.ToInt32(ViewBag.NowPageNumber);//當前頁碼
                                                           //var ProID = ViewBag.ProID;//項目編號
    var Totalpages = Convert.ToInt32(ViewBag.Totalpages);//總頁碼
    var PagingUrl = ViewBag.PagingUrl;
}
<div class="pagelist">
    @if (Totalpages > 0)
    {
        <span class="prev"><a href="@Html.Raw(PagingUrl+1)">首頁</a></span>
        <span class="prev"><a href="@Html.Raw(PagingUrl+(NowNumber == 1 ? 1 : Convert.ToInt32(NowNumber - 1)))">上一頁</a></span>
        if (NowNumber > 0)
        {
            //最小頁碼加載
            var minpageNumber = pageCount;
            if (pageCount >= Totalpages)
            {
                minpageNumber = Totalpages;
            }
            for (var i = 1; i <= minpageNumber; i++)
            {
                <span class="@Html.Raw(i == NowNumber ? "on" : "")"><a href="@Html.Raw(PagingUrl+i)">@i</a></span>
            }
            if (Totalpages > minpageNumber)
            {
                //中間頁碼邏輯
                if ((NowNumber - 1) > minpageNumber && (NowNumber + 1) < (Totalpages - 1))
                {
                    if ((NowNumber - 2) > minpageNumber)
                    {
                        <span>···</span>
                    }
                    for (var i = (NowNumber - 1); i <= (NowNumber + 1); i++)
                    {
                        <span class="@Html.Raw(i == NowNumber ? "on" : "")"><a href="@Html.Raw(PagingUrl+i)">@i</a></span>
                    }
                    if ((NowNumber + 3) < Totalpages)
                    {
                        <span>···</span>
                    }
                }
                else
                {
                    //頁碼樣式 ***3
                    if (NowNumber > (minpageNumber + 1))
                    {
                        <span>···</span>
                    }
                    //
                    if (NowNumber > minpageNumber && NowNumber < (Totalpages - 1))
                    {
                        <span class="on"><a href="@Html.Raw(PagingUrl+NowNumber)">@NowNumber</a></span>
                    }
                    //樣式 ***3***45
                    if (NowNumber < (Totalpages - 2))
                    {
                        <span>···</span>
                    }
                }
                //此處是最大頁碼
                if (Totalpages > (minpageNumber + 2))
                {
                    for (var i = (Totalpages - 1); i <= Totalpages; i++)
                    {
                        <span class="@Html.Raw(i == NowNumber ? "on" : "")"><a href="@Html.Raw(PagingUrl+i)">@i</a></span>
                    }
                }
                else
                {
                    <span class="@Html.Raw(Totalpages == NowNumber ? "on" : "")"><a href="@Html.Raw(PagingUrl+Totalpages)">@Totalpages</a></span>
                }
            }
        }
        <span class="next"><a href="@Html.Raw(PagingUrl+(Totalpages == 1 ? 1 :(Totalpages==NowNumber?Totalpages: Convert.ToInt32(NowNumber + 1))))">下一頁</a></span>
        <span class="prev"><a href="@Html.Raw(PagingUrl+Totalpages)">尾頁</a></span>
        <input type="text" class="number" id="pageNumber">
        <span class="prev jump" onclick="JumpPaging('@PagingUrl',@Totalpages)">跳轉</span>
    }
</div>
<script type="text/javascript">
    function JumpPaging(JumpUrl, allNumber) {
        var pnumber = $("#pageNumber").val();
        console.log(JumpUrl);
        console.log(allNumber);
        if (pnumber == null || pnumber == "" || pnumber == 0) {
            layeralert("請輸入正確的跳轉頁碼", "layui-layer-lan", 6);
            return false;
        }
        if (pnumber > allNumber) {
            layeralert("當前列表共計:" + allNumber + "頁!", "layui-layer-lan", 6);
            return;
        }
        location.href = JumpUrl + pnumber;
    }
</script>

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章