0

我的页面需要从 CMS 获取用户内容并显示在具有静态高度的页面上,并且溢出分为前端页面。

我研究了各种 jQuery Pager 插件,它们都需要一个特定的标签来定位(p、div、li),在我的情况下,我不知道用户输入 CMS 的标签是什么。

var content = $("#weekly-features").children();
var pageHeight = 0;
var nextHeight = 0;
var pageCount = 0;
var start = 0;

    // loop through and wrap p's with page divs
for (var i = 0; i < content.length; i++) {

        pageHeight += $(content[i]).outerHeight();

        if ((i + 1) < content.length) {
nextHeight = $(content[i + 1]).outerHeight();
}

        if ((pageHeight + nextHeight) >= 400) {
pageCount++;
$(content.slice(start, i)).wrapAll('<div class="page' + pageCount + '" />');
pageHeight = 0;
start = i;
}
}

    // wrap remaining page
if (start < content.length) {
pageCount++;
$(content.slice(start)).wrapAll('<div class="page' + pageCount + '" />');
}

    // show first page
$("#weekly-features div").each(function() {
if ($(this).attr('class') == "page1") { return; }
else { $(this).hide(); }
});

    buildPagerNav(pageCount);
}

有任何想法吗?

  • 编辑更具体 - 问题在于静态高度要求:我的 html 看起来像这样:

第 1 段(短)

第 2 段(短)

第 3 段(长)

  • 清单 1
  • 清单 2
  • 清单 3
  • 清单 4
  • 清单 5

第 4 段(短)

  • 清单 1
  • 清单 2
  • 清单 3
  • 清单 4
  • 清单 5

其中短段落将在同一页面上,而长列表将需要分成单独的页面......我猜有点像在 Word 中插入动态分页符......

4

1 回答 1

1

您是否考虑过使用 $("*") 选择器?这将选择任何可用的标签

准确地说,你可以做这样的事情

$("#contentCMS *").pager();

或者

$("#contentCMS").find(*).pager();

于 2011-03-31T18:39:52.397 回答