如果数量太多,如何在分页或面包屑中创建点

how to create dots in pagination or breadcrumb if they are too much in number

我想在面包屑中创建超出特定数量限制的点。我添加了脚本来创建面包屑,但它不起作用。

我被困在必须添加点的地方,这样当面包屑项目超过时它会隐藏并创建点

function getBreadCrumb() {
  if (window.ActiveTab != 'local') {
    $('#fr-h-r-3 .breadcrumb.fr-breadcrumb').html('');
    return false
  }

  /*alert(window.ActiveTab);
  if(window.ActiveTab == 'fb'){
    $('#fr-h-r-3 .breadcrumb.fr-breadcrumb').html('<li><a href="javascript:void(0);" onClick="$(document).trigger(\'ImageManager.LoadBreadCrumbFolder\',[this]);" data-name="Facebook-Images" data-hist="Facebook-Images/" data-path="'+b.opts.userFolderDefaultPath+'Facebook-Images">Facebook-Images</a></li>');
    return false;
  }else if(window.ActiveTab == 'ig'){
    $('#fr-h-r-3 .breadcrumb.fr-breadcrumb').html('<li><a href="javascript:void(0);" onClick="$(document).trigger(\'ImageManager.LoadBreadCrumbFolder\',[this]);" data-name="Instagram-Images" data-hist="Instagram-Images/" data-path="'+b.opts.userFolderDefaultPath+'Instagram-Images">Instagram-Images</a></li>');
    return false
  }*/

  var currentPath = b.opts.userFolderDefaultPath;
  if (b.opts.imageManagerFolders.length > 0) {
    currentPath = b.opts.userFolderDefaultPath + b.opts.imageManagerFolders.join('/') + '/';
  }
  var sArray = currentPath.split('/');
  var fArray = currentPath.split('/');

  fArray.pop();
  fArray.shift();
  sArray.shift();
  sArray.shift();
  sArray.shift();
  sArray.pop();
  var html = '<li><a href="javascript:void(0);" onClick="$(document).trigger(\'ImageManager.LoadBreadCrumbFolder\',[this]);" data-name="#home" data-hist="" data-path="/' + fArray[0] + '/' + fArray[1] + '/"><span class="fa fa-home"></span></a></li>';

  /*console.log('sArray: '+sArray);
  console.log('fArray: '+fArray);*/

  function getPath(i) {
    var hisPath = '';
    for (var j = 2; j < (i + 3); j++) {
      if (fArray[j] != 'undefined') {
        hisPath += fArray[j] + '/';
      }
    }
    return hisPath;
  }

  if (sArray.length > 6) {
    as = 4;
    al = (sArray.length - 3)
  }
  sts = false;

  for (var i = 0; i < sArray.length; i++) {

    if ((i + 1) != sArray.length) {
      if (typeof as != 'undefined' && i == as) {
        sts = true;
      }
      if (typeof al != 'undefined' && i == al) sts = false;
      if (sts == false) {
        html += '<li><a onClick="$(document).trigger(\'ImageManager.LoadBreadCrumbFolder\',[this]);" href="javascript:void(0);" data-name="' + sArray[i] + '" data-hist="' + getPath(i) + '" data-path="/' + fArray[0] + '/' + fArray[1] + '/' + getPath(i) + '">' + sArray[i] + '</a></li>';
      }
    } else {
      html += '<li class="active">' + sArray[i] + '</li>';
    }

    //html += '<li class="active">'+sArray[i]+'</li>';
  }
  $('#fr-h-r-3 .breadcrumb.fr-breadcrumb').html(html);
}

谢谢你的努力,我正在研究这个,我只通过将这段代码添加到函数中就解决了这个问题。

if(typeof as != 'undefined' && i==as) { sts = true; html += '<li>...</li>'; }

线在哪里

if (typeof as != 'undefined' && i == as) {
    sts = true;
  }

此脚本正在生成您可以在脚本中看到的分页。最后的输出是这样的。 没有点的简单分页。

  • check
  • tttt
  • New-Folder-1
  • New-Folder-1
  • New-Folder-1

    当超过 6 里时,它会创建点。像这样。

  • check
  • tttt
  • New-Folder-1
  • New-Folder-1
  • ...
  • New-Folder-1
  • htest
  • tes2