ホームページ > ウェブフロントエンド > jsチュートリアル > javascript カスタム length_javascript スキルでテキストを自動的に折り返す関数

javascript カスタム length_javascript スキルでテキストを自動的に折り返す関数

WBOY
リリース: 2016-05-16 19:09:42
オリジナル
1062 人が閲覧しました

Web ページを作成する過程で、多くの友人は、style="table-layout:fixed;word-wrap:break-word;word- を使用することはできますが、一部の英語の単語が元の表を引き伸ばして変形を引き起こす場合があることに常に気づきます。この問題を解決するには「break :break-all」を使用しますが、コンテンツが不完全に表示されて非表示になり、自動行折り返し効果が得られない場合があります。

そこで、この欠陥を修正するために次のような関数を書きたいと思いました。この関数は非常に単純ですが、ここではこの問題を解決するためのアイデアを提供します。

function fnAddBr(id, iPerLineLen){....}
id は変更するテキスト ブロックの ID、iPerLineLen は各行の長さ
nbsp;HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">



無題のドキュメント





Web ページの作成時に追加したコンテンツにより、Web ページの生成後に表が常に横方向に非常に広くなってしまい、見苦しくなってしまいました。

style="table-layout:fixed;word-wrap;" を追加しました。 :break-word;word-break:break-all"

このコードを実行すると、表は幅を広げられませんが、内容は完全には表示されません。表と同じ幅の内容のみが表示されます。が表示され、その他のコンテンツはブロックまたは除外されます。
私のものは漢字ですが、関係ありますか?

表内のテキストが一定の単語数に達したときに自動的に新しい行に変更する方法はありますか?あるいは、表を大きくしすぎたり、コンテンツを省略したりすることなく、行を折り返すこともできます。

私のコンテンツは東義ではこのタグと呼ばれています!




Web ページの作成時に追加したコンテンツは、Web ページの生成後に常に表が横方向に非常に広くなります。これは醜いものです。

style="table-layout:fixed;word-wrap:break-word;word-break:break-all"

このコードを追加すると、テーブルは拡張されませんが、コンテンツは拡張されます。 be 表示は完全ではなく、表と同じ幅のコンテンツのみが表示され、他のコンテンツはブロックまたはフィルターで除外されます。
私のものは漢字ですが、関係ありますか?

表内のテキストが一定の単語数に達したときに自動的に新しい行に変更する方法はありますか?あるいは、表を大きくしすぎたり、コンテンツを省略したりすることなく、行を折り返すこともできます。

私のコンテンツは東義ではこのタグと呼ばれています!





<script> <BR>//函数功能:在指定长度处自动添加换行符,以英文长度为准,及8代表8个英文或4个汉字 <BR> function fnAddBr(id, iPerLineLen){ <BR> var sStr=document.getElementById(id).innerHTML; <BR> if(sStr.replace(/[^\x00-\xff]/g,"xx").length <= iPerLineLen){ <BR> return -1; <BR> } <br><br> var str=""; <BR> var l=0; <BR> var schar; <BR> for(var i=0;schar=sStr.charAt(i);i++){ <BR> str+=schar; <BR> l+=(schar.match(/[^\x00-\xff]/)!=null?2:1); <BR> if(l>= iPerLineLen){ <BR> str+="<br />\n"; <BR> l=0; <BR> } <BR> } <BR> document.getElementById(id).innerHTML=str; <BR> } <BR> </script> <script> <BR> fnAddBr("content",25); <BR> fnAddBr("content1",50); <BR></script>
関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート