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 に答える