jQuery帶搜尋跳轉功能的清單分頁代碼
js程式碼
<script> var page = 1; var limit = 10; var sumPage = 6; var size = 28; $(function(){ page = parseInt(page); limit = parseInt(limit); //防止页码出现字符串,转换类型 loadClass(); setPageMsg(); initPage(); $("#pageLt").find("a").unbind("click").click(function(){ $("#pageLt").find("a").removeClass("active"); $(this).addClass("active"); limit = parseInt($(this).text()); // 分页执行的fun }); }); function loadClass(){ if(limit == 10){ $("#pageLt").find("a").removeClass("active"); $("#pageLt").find("a").eq(0).addClass("active"); }else if(limit == 20){ $("#pageLt").find("a").removeClass("active"); $("#pageLt").find("a").eq(1).addClass("active"); }else if(limit == 30){ $("#pageLt").find("a").removeClass("active"); $("#pageLt").find("a").eq(2).addClass("active"); }else if(limit == 40){ $("#pageLt").find("a").removeClass("active"); $("#pageLt").find("a").eq(3).addClass("active"); } } /** 初始化分页控件 **/ function initPage(){ $(".down_page").click(function(){ //上一页 if(page != 1){ page = page - 1; $("#nowPage").text(page); // 分页执行的fun }else{ alert("已经是第一页了","warning"); } }); $(".up_page").click(function(){ //下一页 if(page < parseInt(sumPage)){ page = page + 1; $("#nowPage").text(page); // 分页执行的fun }else{ alert("已经是最后一页了","warning"); } }); $(".jump_page").click(function(){ var pageNum = $("#pageNum").val(); if(parseInt(pageNum) <= parseInt(sumPage)){ page = parseInt(pageNum); $("#nowPage").text(page); // 分页执行的fun }else{ alert("页数不能大于总页数","warning"); } }); } function setPageMsg(){ $("#count").text(size); $("#nowPage").text(page); $("#allPage").text(""+sumPage+"页"); } </script>
Jquery是網頁程式設計所需的重要技術之一。 Jquery是繼prototype之後又優秀的Javascrīpt框架,它是輕量級的js函式庫,它相容於CSS3,也相容於各種瀏覽器。 jQuery讓用戶能更方便地處理HTML documents、events、實現動畫效果,並且方便地為網站提供AJAX互動。 jQuery還有一個比較大的優點是,它的文件說明很全,而且各種應用也說得很詳細,同時還有許多成熟的插件可供選擇。 jQuery能夠讓使用者的html頁保持程式碼和html內容分離,也就是說,不用再在html裡面插入一堆js來呼叫指令了,只要定義id即可。
本站所有資源皆由網友貢獻或各大下載網站轉載。請自行檢查軟體的完整性!本站所有資源僅供學習參考。請不要將它們用於商業目的。否則,一切後果都由您負責!如有侵權,請聯絡我們刪除。聯絡方式:admin@php.cn
相關文章
18 Jan 2017
這是一款以jquery為基礎的超逼真下雪場景特效。此特效使用jquery程式碼來動態外掛程式html5 canvas元素,然後在canvas中製作下雪特效。
18 Jan 2017
這是一款使用jQuery和CSS3來製作的酷炫漢堡包變形動畫特效。此特效透過jQuery來附加按鈕事件,並透過CSS3 transform和animation來製作動畫特效。
23 May 2023
隨著網路的普及,打字特效的應用越來越廣泛,jquery打字特效也成為了許多網站開發人員的首選。然而,在實現這種特效的過程中,細節問題常常會影響使用者體驗,例如打字特效的回刪問題。本文將介紹如何利用jquery打字特效停止回刪,提升使用者的瀏覽體驗。 jquery打字特效的實作可以使用現成的插件,如typed.js和jQuery.Typewriter等。這些插件都是基於jquery的
16 May 2016
jquery提示效果很多,本文也提供一個超漂亮的仿騰訊彈出層效果,熱愛特效的你可千萬不要錯過了啊,希望本文提供的案例對你學習jquery特效有所幫助
16 May 2016
這篇文章主要介紹了jQuery實現玻璃流光質感的手風琴特效,是一款基於jQuery CSS3實現手風琴特效,希望你可以喜歡。
28 Nov 2017
jquery中我們最需要用的除了異步,就是動畫和特效了吧,要想給用戶更好的體驗jquery是最好的選擇,就讓我們一起來看看jquery的動畫、特效的詳解吧
Hot Tools
jQuery2019情人節表白放煙火動畫特效
一款抖音上很火紅的jQuery情人節表白放煙火動畫特效,適合程式設計師、科技宅用來向心愛的女孩告白,無論你選擇願意或不願意,到最後都得同意。
layui響應式動畫登入介面模板
layui響應式動畫登入介面模板
520情人節表白網頁動畫特效
jQuery情人節表白動畫、520表白背景動畫
酷炫的系統登入頁
酷炫的系統登入頁
HTML5卡音樂播放器-CASSETTE PLAYER
HTML5卡音樂播放器-CASSETTE PLAYER