街中で見かけて「グッときた人」の思い出

いつもお世話になっています。

自分では以前から疑問に思いつつも放置していた問題です。
その問題とは、UL,LIタグでツリー表示を行い、
各項目にリンクがあります。その項目の選択位置が
項目の文字の長さによって文字がないところでも選択が出来るのです。

言語仕様であればそれで通すのですが、そういうわけでもなさそうな気配なのでどうにか解決したいと思っています。

ソースは下記のようになっていています。
<nobr><ul>
<li id=foldheader><a href="">ZZZZZ</a></li>
<ul id=foldinglist style=display:none style=&amp;{head}>
<li id=foldend><a href="">XXXXXXX</a></li>
<ul id=foldinglist style=display:none style=&amp;{head}>
</ul>
</ul>
</nobr>

これでいうと、ZZZZZの文字のちょっと後ろがクリックできて、XXXXXXXが表示されます。
で、XXXXXXXが表示されるとXXXXXXXの長さ+アルファぶんだけ後ろまでZZZZZの後ろに選択できる範囲が広がります。
また、XXXXXXXの前にも選択出来る範囲が出てきます。

これを、純粋に文字の部分だけ選択出来るようにする方法はあるのでしょうか?

以上、よろしくお願いいたします。

※文字数制限により、開閉のJavaScriptは省略

A 回答 (2件)

 <LI>と<UL>の使い方がバラバラです。


 <UL></UL>は、リスト表示する範囲をしていするタグ、<LI>はその<UL>タグの内部に記述することにより、要素を指定するタグです。
 よって、

<UL>
  <LI><A>ZZZZZZZZ</A></LI>
  <LI><A>XXXXXXXX</A></LI>
</UL>

 こんな感じにしてみてください。

この回答への補足

早速のレスありがとうございます。
元々、下記のリンクのものを参考に作成しました。

http://www001.upp.so-net.ne.jp/oka/tree_menu3.htm

ですので、要素上ULタグが何層にもなるのはやむをえないと思っていました・・・

本番直前でもう時間がないのですが、なんとか改良してみます

補足日時:2004/02/04 15:43
    • good
    • 0

ulタグの使い方はさておき、



そのサイトのスクリプトですと、id=foldheader と名付けられた部分のクリックを判定してますから、この場合liタグのクリックを判定するため、文字部分以外もクリック対象になっているようです。
中のAタグ内からonclickで関数を呼び出すようにすれば改善できると思います。
    • good
    • 0
この回答へのお礼

レスが遅れました。
おっしゃるように、Aタグ内からonclickイベントで
呼ぶようにしましたので、問題点は解決いたしました。
ありがとうございました

お礼日時:2004/02/05 14:01

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!