1

あなたの助けが必要です。div にコンテンツが含まれています。これには 300 ピクセルの高さが必要ですが、コンテンツは高さよりも長いため、同じ 300 ピクセルの高さで次の div にコンテンツを続ける必要があります。

これは、個別に印刷するためにこれらの div に分割される印刷モジュールのようなものである必要があります。どんな種類の助けにも感謝します！

私が必要とするのは次のようなものです：

<!--Turn this: -->

    <div class="content">
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

    /******Ut wisi enim ad minim veniam, quis nostrud exerci tation****/ 
    </div>

    <div class="content"></div>



   <!--Into this: -->
    <div class="content">
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

    (supose this text fills the div)

    </div>

    <div class="content">
    (and the content continues here)
    /******Ut wisi enim ad minim veniam, quis nostrud exerci tation****/ </div>
4

2 に答える 2

0
  1. Pタグを作成し、このタグ内にコンテンツを追加します（コンテンツを超えるとタグの高さとdivの高さが異なります。
  2. 最初の div の高さ (固定の高さ) と最初の DIV 内の最初の P タグ (コンテンツに基づく高さ) を取得します。
  3. の高さ

    p の高さよりも小さい (DIV の高さは P の高さよりも小さい、コンテンツを超えることを意味する) 3.1 P タグ (最初の DIV 内の最初の P) からいくつかのコンテンツをポップし、変数 var_exceed_content に追加します。

  4. すべての var_exceed_content 変数値を 2 番目の div に移動します (継続 DIV):)

HTML:

<div class="content" style='  height:20px;
    background:blue;
    margin-bottom:10px;'>
    <p>    Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

    /******Ut wisi enim ad minim veniam, quis nostrud exerci tation****/.</p>
</div>
<div class="content_continues" style='    
    background: green;
    margin-bottom:10px;
    padding:10px;'>
    <p></p>
</div>

JavaScript コード:

var cont1 = $('.content');
var cont1Height = cont1.height();

var p1 = $('.content p');
var p1Height = p1.height();


var p2 = $('.content_continues p');

//get text and explode it as an array
var p1text = p1.text();
p1text = p1text.split('');

//prepare p2 text
p2text = [];

//if greater height
while (p1Height > cont1Height) {

    //remove last character
    lastChar = p1text.pop();

    //prepend to p2 text
    p2text.unshift(lastChar);

    //reassemble p1 text
    p1temp = p1text.join('');

    //place back to p1
    p1.text(p1temp);

    //re-evaluate height
    p1Height = p1.height();

    //loop
}

//if less than, assemble p2 text and render to p2 container
p2.text(p2text.join(''));

このDEMOをチェックしてください

于 2013-06-29T05:26:12.390 に答える
0

オーバーフローを取得して次のコンテンツ div に追加する JavaScript を記述できます。

if (contentdiv.length > x ) {
    nextdiv.innerHTML = contentdiv.innerHTML.substring(x);
}

うん…汚い。それがサブストリング meth の使い方だと思います。久しぶりです。ただし、「x」値を取得する良い方法を見つけ出す必要があります。

于 2013-06-29T05:33:03.140 に答える