WEB相談室

Webページ作成に関しての何でも掲示板です。

タイトル:表に表示する文字列の改行について

0:[投稿] まこと [2005/12/14 11:34 ] [環境:わからない わからない]

はじめまして。まことと申します。JSPについて質問があります。

あるページで登録した文字列を表に表示させるのですが、表の幅を固定しています。そのとき、日本語を登録すると、表の幅を超える文字数の場合でも改行して、幅の範囲内に収めることができます。しかし、英数字の場合、改行されずに1列に羅列して表示されてしまいます。

この場合、どのようにしたら英数字の改行ができるようになるのでしょうか?わかる方がいらっしゃればご教授ください。よろしくお願いいたします。


1:[回答] 老衰 [2005/12/14 12:32 ]

div.offsetWidth で文字列の幅が取れます。
地道にやれば、指定枠内に収まるように強制改行を
挿入することもできます。

IE 限定なら、word-break だったか?CSS調べてみてください。

<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
function forceBr(oTab,w,row,col) {
  var td = oTab.rows[row].cells[col];
  var str = td.innerText;

  var wk = document.getElementById("work");
  var htm = "";
  var pht = "";
  for (var i=0;i < str.length;i++) {
    pht = htm;
    htm += str.charAt(i);
    wk.innerHTML = htm;
    if (parseInt(wk.offsetWidth) > w) {
      htm = pht + "<br>" + str.charAt(i);
    }
  }
  td.innerHTML = htm;      
}
window.onload = function() {

 forceBr(document.getElementsByTagName("table")[0],100,0,1);
 forceBr(document.getElementsByTagName("table")[0],100,1,1);
 forceBr(document.getElementsByTagName("table")[0],100,2,1);
}
</SCRIPT>
</HEAD>
<BODY>
<table border>
<colgroup>
<col width=100>
<col width=100>
</colgroup>
<tr><td>001<td onclick="alert(this.offsetWidth)">
AAAAAAAAABBBBBBBBBBBCCCCCCCCCCCCDDDDDDDDDDDDDEEEEEEE
<tr><td>002<td>FFFFFFFFFGGGGGGGGGGGHHHHHHHHHHHHIIIIIIIIIIIIIJJJJJJJ
<tr><td>003<td>KKKKKKKKKLLLLLLLLLLLMMMMMMMMMMMMNNNNNNNNNNNNNOOOOOOO
</table>
<hr>
<span id=work></span>

こんな感じ。innerText がちょっと怪しいので、とりあえず、
全ブラウザで同じ動作をするかどうかはご自分で確認してくだ
さいな。
たぶん、Moz系はNGでしょう。テキスト以外が入っていると更
にややこしくなります。プレーンテキストのみで構成されている
ことが前提です。


onload のとこの3行をコメントアウトした画面と、コメント
を取った画面を見比べて、さらに、col=1 行をクリックすると
その幅を表示します。104 とか、102 って出てくるはずですが、
指定値=100 に対して、微妙に異なる結果なのは、レンダリング
エンジンに起因しています。枠を含めたサイズか、枠を除く
サイズでレンダリングするか(枠以外にもパディングとか、
マージンとかあります)各要素が微妙に枠内サイズに関わって
くるためです。ここらへんがクリアできればきちっとしたサイズ
でテーブルを表示することも出来ます、たぶん。


2:[完了] まこと [2005/12/14 17:24 ]

ありがとうございます。

ご教授いただいたことを試してみます。

回答(必須): 状態:

お名前(必須):

URL:




[戻る]