zl程序教程

您现在的位置是:首页 >  前端

当前栏目

jquery ajax分页 js对象

2023-09-14 08:59:47 时间

jQuery.page.js分页类 js对象解决同一个方法在页面引入多次报错问题(调用:对象.方法)


    url:busimodules.php,  //获取分页的数据      issort: true,           //是否显示排序序号      pageSize:4,             //每页显示的条数      name:page,            //该值必须和实例化对象一样,如果创建多个实例的话实例名称不能相同      fileds:[mname, price, buytime], //要显示的字段,必须和url参数:busimodules.php的返回值一致      tabcontainer: tab_mod,//表格id      navcontainer: pager1  //翻页导航显示的id   var page3 = new Page({      url:busimodules.php,      name:page3,      pageNavFun:getPageBar2,      pageSize:12,      callback:function (jsondata, navstr) {}   * busimodules.php返回json数据格式:   {"total":6,"pageSize":3,"curPage":1,"totalPage":2,"data":[{"mname":"\u8d2d\u7269\u8f66","price":"10.00","buytime":"2013-12-16 13:40:23"},{"mname":"\u6536\u85cf","price":"10.00","buytime":"2013-12-16 13:40:16"},{"mname":"\u8ba2\u5355","price":"10.00","buytime":"2013-12-16 13:40:10"}]}   如果要将返回结果自己处理,可以在参数name的后面加上参数callback:function (jsondata, navstr) {处理逻辑} 后面的tabcontainer等参数就都没有用了   */   var Page = function (options) {       var defaults = {           navNum:10,           navOffset:1,           pageSize:3,           data:{},           pageNavFun:getPageBar,           issort:false       };       this.options = $.extend({}, defaults, options);       if(!this.options.url) {return false;}       if(!this.options.name) {return false;}       if(!this.options.callback) {           if(!this.options.tabcontainer) {return false;}           if(!this.options.navcontainer) {return false;}           if(!this.options.fileds || this.options.fileds.length   1) {return false;}       }       this.init();   Page.prototype.init = function () {       this.getPageData(1);    * 获取对应页数据   * p表示当前页数   * 返回当前页的数据,和导航数据   */   Page.prototype.getPageData = function (p) {       $this = this;       if (!p) p = 1;       ajaxSendData = pagesize= + $this.options.pageSize +  p= + p;       $.each($this.options.data, function (name, val) {           ajaxSendData += " " + name + "=" + val;       });       $.ajax({           type:POST,           url:$this.options.url + "?t=" + Math.random(),           data:ajaxSendData,           async:false,           dataType:JSON,           success:function (obj) {               var navstr = eval($this.options.pageNavFun + "(obj, $this.options)");               var data = obj.data;               if ($this.options.callback) {                   $this.options.callback(data, navstr);               } else {                   var html = ;                   var shtml = ;                   for (var i = 0; i   data.length; i++) {                       if ($this.options.issort) {                           shtml =  td   + ($this.options.pageSize * (p - 1)-0 + (i + 1)) +  /td ;                       }                       html +=  tr  + shtml;                       var k = 1;                       if (shtml != ) {                           k = 2;                       }                       for (var j = 0; j   $this.options.fileds.length; j++) {                           html +=  td class="col- + k + "  + data[i][$this.options.fileds[j]];                           k++;                       }                       html +=  /tr ;                   }                   if (!$(# + $this.options.tabcontainer).find(tr:eq(1))[0]) {                       $(# + $this.options.tabcontainer).append(html);                   }                   else {                       $(# + $this.options.tabcontainer).find(tr:gt(0)).remove();                       $(# + $this.options.tabcontainer).append(html);                   }                   $(# + $this.options.navcontainer).html(navstr);               }           }       });   function getPageBar(obj, opt) {       if (!obj) return false;       curPage = parseInt(obj.curPage, 10);       if (curPage   obj.totalPage) {           curPage = obj.totalPage;       }       if (curPage   1) {           curPage = 1;       }       if (curPage  = parseInt(opt.navNum / 2, 10)) {           opt.navOffset = 1;       }       else {           opt.navOffset = curPage - parseInt(opt.navNum / 2, 10);       }       var prev = next = 0;       var startnav = endnav = ;       if (curPage == 1) {           startnav =  li  首页 /li   li  上页 /li ;       }       else {           prev = curPage - 1;           startnav =  li  string" >.getPageData(1);" 首页 /li   li  string" >.getPageData( + prev + );" 上页 /li ;       }       if (curPage == obj.totalPage || obj.totalPage == 0) {           endnav =  li  下页 /li   li  末页 /li ;       }       else {           next = curPage + 1;           endnav =  li  string" >.getPageData( + next + );" 下页 /li   li  string" >.getPageData( + obj.totalPage + );" 末页 /li ;       }       var amongNav = ;       for (var i = opt.navOffset; i   opt.navOffset + opt.navNum; i++) {           if (i == curPage) {               amongNav +=  li   + i +  /li ;           }           else {               amongNav +=  li  string" >.getPageData( + i + );"  + i +  /li ;           }           if (i  = obj.totalPage)               break;       }       var jump =  input type="text" name="page"  id="jump_page" maxlength="4" / ;       jump +=  input type="button"  id="jump_btn" value="go" / ;       return startnav + amongNav + endnav + jump;  
Cat.prototype.say = function(){       console.log(I am +this.name+, I am +this.age);   var kk = new Cat(kk);   console.log(kk.name);//undefined @private   kk.setName(deeka);   console.log(kk.getName()); // deeka   kk.setAge(2);   console.log(kk.getAge()); // 2   kk.age = 3;   console.log(kk.age);//3 @public   kk.say(); // I am deeka, I am 3  
详细解析JavaScript的Ajax之同步和异步的区别 详细解析JavaScript的Ajax之同步异步的区别 博客整理到这里基本上JavaScript的初级知识就整理完了,现在我们来说一下看JavaScript的最后一个知识点——Ajax。 (Asynchronous Javascript And XML) 即异步 JavaScript 和 XML,一种创建交互式、快速动态网页应用的网页开发技术,无需重新加载整个网页的情况下,能够更新部分网页的技术。 1.同步和异步 首先我们先来分析一下JavaScript的中的同步和异步的区别。 同步就是调用某个内容时,调用方得等待这个调用返回结果才能继续往后执行。(期间不可以执行其他的命令)。如图: