表格分页

jQuery.fn.JsonToTable = function(json, title, editable, isPaged) {
  var Obj; //存储json数据
  var Title = title; //表格的列名数组
  var Editable = editable; //列是否可编辑数组
  var TableHtml = '<table>'; //表格html代码
  var PAGE_SIZE = 10; //每页显示的行数
  var totalRowNum = 0; //总的行数
  var i;

  if ((typeof(JSON) == "undefined")) Obj = eval("(" + json + ")");
  else Obj = JSON.parse(json);
  TableHtml += '<tr>';
  for ( i = 0; i < Title.length; i++) {
    TableHtml += '<td>' + Title[i] + '</td>';
  }
  TableHtml += '</tr>';

  for (var o in Obj) {
    totalRowNum++;
    TableHtml += '<tr>';
    for ( i = 0; i < Title.length; i++) {
      if (Obj[o][Title[i]] == '') TableHtml += '<td>&nbsp;</td>';
      else TableHtml += '<td>' + Obj[o][Title[i]] + '</td>';
    }
    TableHtml += '</tr>';
  }

  TableHtml += '</table>';
  if (isPaged) { //如果分页
    if (totalRowNum > PAGE_SIZE) {
      var pageTotal = parseInt(totalRowNum % PAGE_SIZE == 0 ? totalRowNum / PAGE_SIZE : totalRowNum / PAGE_SIZE + 1);
      TableHtml += '<div id="paging"><a class="pre" href="javascript:void(0);">&nbsp;</a>';
      for (i = 0; i < pageTotal; i++) {
        TableHtml += '<a>' + (i + 1) + '</a>';
      }
      TableHtml += '<a class="next" href="javascript:void(0);">&nbsp;</a></div>';
    }
    $(this).html(TableHtml);
    showTable(1, totalRowNum, PAGE_SIZE); //默认显示第一页
  }else
  {
    $(this).html(TableHtml);
  }
 

  $(this).find("tr:even:not(:first)").addClass('even');
  $(this).find("tr:odd").addClass('odd');
  $(this).find("tr:first").addClass('title');

  $(this).find("#paging a").click(function() {
    var curPage;
    $("#paging a").each(function() {
      if ($(this).hasClass("current")) {
        curPage = $(this).text();
        $(this).removeClass("current");
      }
    });

    if ($(this).hasClass("pre")) {
      if (curPage == 1) curPage = 1;
      else curPage = curPage - 1;
    } else if ($(this).hasClass("next")) {
      if (curPage == pageTotal) curPage = pageTotal;
      else curPage = parseInt(curPage) + 1;
    } else {
      curPage = $(this).text();
    }

    showTable(curPage, totalRowNum, PAGE_SIZE);

  });

  $(this).find("td").each(function(index) {
    if (index < Title.length) return;
    $(this).click(function() {
      if (Editable[index % Title.length] == 0) return;
      CreateEdit($(this), $(this).html());
    });
  });
}

jQuery.fn.FixTableHeader = function(lengths) {
  // var top = $('.content table tr:eq(0)').offset().top;
  var loaded = true;
  var tableheader = $(this).find('table tr:eq(0)');
  var top = tableheader.offset().top;
  $(window).scroll(function() {
    var scrolla = $(window).scrollTop();
    var cha = parseInt(top) - parseInt(scrolla);
    if (loaded && cha <= 0) {
      var tmp = '';
      var i = 0;

      tableheader.find('td').each(function() {
        tmp = lengths[i] + 'px';
        $(this).css({
          'width': tmp
        });
        i++;
      });
      tableheader.addClass('fixtitle');
      loaded = false;
    }
    if (!loaded && cha > 0) {
      tableheader.removeClass('fixtitle');
      loaded = true;
    }
  });
}

function showTable(curPage, total, pageSize) {
  $("table tr").each(function(index) {
    if ((index <= curPage * pageSize) && (index > (curPage - 1) * pageSize)) $(this).removeClass("displaynone");
    else $(this).addClass("displaynone");
  })
  $("table tr:first").removeClass("displaynone");

  $("#paging a").each(function() {
    if ($(this).text() == curPage) {
      $(this).addClass("current");
    }
  });
}

function CreateEdit(element, value) {
  //检查编辑状态，如果已经是编辑状态，跳过
  var editState = element.attr('EditState');

  if (editState != 'true') {
    //创建文本框
    var textBox = document.createElement('INPUT');
    textBox.type = 'text';
    textBox.className = 'EditCell_TextBox';

    //设置文本框当前值
    if (!value || value == '&nbsp;') {
      value = '';
    }
    textBox.value = value;

    //设置文本框的失去焦点事件
    textBox.onblur = function() {
      CancelEditCell(this.parentNode, this.value);
      element.attr('EditState', 'false');
    }
    //向当前单元格添加文本框
    ClearChild(element);
    element.append(textBox);
    textBox.focus();
    textBox.select();

    //改变状态变量
    element.attr('EditState', 'true');
    //element.parentNode.parentNode.setAttribute('CurrentRow', element.parentNode.rowIndex);
  }
}

//取消单元格编辑状态

function CancelEditCell(element, value, text) {
  //element.setAttribute('Value', value);
  //var tempvalue=parseFloat(value);

  //if((tempvalue<=100&&tempvalue>=0)||value=='')
  //{
  if (value == '') value = '&nbsp;';
  if (text) {
    element.innerHTML = text;
  } else {
    element.innerHTML = value;
  }
  //}
  //else
  //{
  //    alert('你输入的格式有误!');
  //    element.children[0].focus();
  //    element.children[0].select();
  //    return;
  //}
  element.setAttribute('EditState', 'false');
}

//清空指定对象的所有字节点

function ClearChild(element) {
  element.html('');
}

转载于:https://www.cnblogs.com/hqu-ye/archive/2013/04/09/3010975.html