扩展JQuery很容易,作为一个练习,编写一个简单的分页插件,代码量不大,直接看代码好了:

$.fn.mypagination = function(totalProperty,opts){ 
  opts = $.extend({ 
    perPage:10, 
  
    callback:function(){ 
    } 
  },opts||{}); 
     
  return this.each(function(){ 
    function numPages(){ 
      return Math.ceil(totalProperty/opts.perPage); 
    } 
  
     
    function selectPage(page){ 
      return function(){ 
        currPage = page; 
        if (page<0) currPage = 0; 
        if (page>=numPages()) currPage = numPages()-1; 
        render(); 
  
        $('img.page-wait',panel).attr('src','images/wait.gif'); 
        opts.callback(currPage+1); 
        $('img.page-wait',panel).attr('src','images/nowait.gif'); 
      } 
    } 
     
    function render(){ 
  
      var html = '<table><tbody><tr>'  
        +'<td><a href="#"><img class="page-first"></a></td>' 
        +'<td><a href="#"><img class="page-prev"></a></td>' 
        +'<td><span>第<input type="text" class="page-num">页/共'+numPages()+'页</span></td>' 
        +'<td><a href="#"><img class="page-next"></a></td>' 
        +'<td><a href="#"><img class="page-last"></a></td>' 
        +'<td><img src="/UploadFiles/2021-04-02/nowait.gif">

下面测试一下:

<head> 
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
  <link rel="stylesheet" href="mypagination.css"/> 
  <script type="text/javascript" src="/UploadFiles/2021-04-02/jquery-1.2.6.js">

运行效果图如下:

基于jquery编写分页插件

以上就是本文的全部内容,希望对大家的学习有所帮助。

标签:
jquery编写分页插件,jquery分页插件

免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
评论“基于jquery编写分页插件”
暂无“基于jquery编写分页插件”评论...

RTX 5090要首发 性能要翻倍!三星展示GDDR7显存

三星在GTC上展示了专为下一代游戏GPU设计的GDDR7内存。

首次推出的GDDR7内存模块密度为16GB,每个模块容量为2GB。其速度预设为32 Gbps(PAM3),但也可以降至28 Gbps,以提高产量和初始阶段的整体性能和成本效益。

据三星表示,GDDR7内存的能效将提高20%,同时工作电压仅为1.1V,低于标准的1.2V。通过采用更新的封装材料和优化的电路设计,使得在高速运行时的发热量降低,GDDR7的热阻比GDDR6降低了70%。