想制作一個(gè)新聞加載更多(duō)的(de)效果，隻想在一個(gè)asp頁面裏實現。不加載其它URL頁面，我用(yòng)這(zhè)個(gè)asp程序默認循環出20條數據，我想要的(de)效果是第一屏顯示10條，然後下(xià)方有個(gè)加載更多(duō)。然後再加載第11-20條數據。
<script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="js/jquery.showmorechildren.js"></script> <ul class="showMoreNChildren" pagesize="5"> '一頁顯示5條 <li>FTP上傳網頁文件無法更新删除</li> <li>合理(lǐ)的(de)設計網頁10條建議(yì)，改善網站可(kě)讀性</li> <li>上海網站維護包括哪些?</li> <li>ASP 字母轉換大(dà)小寫</li> <li>asp獲取内容當中第一張圖片</li> <li>asp編輯當前記錄，并返回當前頁數</li> <li>asp獲取文章(zhāng)裏的(de)圖片路徑</li> <li>SEO站長(cháng)具備三個(gè)優化(huà)必備條件</li></ul>
jquery.showmorechildren.js 代碼
(function () { var showMoreNChildren = function ($children, n) { //顯示某jquery元素下(xià)的(de)前n個(gè)隐藏的(de)子元素 var $hiddenChildren = $children.filter(":hidden"); var cnt = $hiddenChildren.length; for ( var i = 0; i < n && i < cnt ; i++) { $hiddenChildren.eq(i).show(); } return cnt-n;//返回還(hái)剩餘的(de)隐藏子元素的(de)數量 } //對(duì)頁中現有的(de)class=showMorehandle的(de)元素，在之後添加顯示更多(duō)條，并綁定點擊行爲 $(".showMoreNChildren").each(function () { var pagesize = $(this).attr("pagesize") || 10; var $children = $(this).children(); if ($children.length > pagesize) { for (var i = pagesize; i < $children.length; i++) { $children.eq(i).hide(); } $("<div class='showMorehandle' >顯示更多(duō)</div>").insertAfter($(this)).click(function () { if (showMoreNChildren($children, pagesize) <= 0) { //如果目标元素已經沒有隐藏的(de)子元素了(le)，就隐藏“點擊更多(duō)的(de)按鈕條” $(this).hide(); }; }); } }); })();
