掲示板/総合質問板/過去ログ/一覧/ プルダウンメニューがうまく作動しない

0 名前： mima ： 2006/01/04 05:19 ［URL］: おそらく、スクリプトではなくてHTMLのみでのプルダウンメニューを使っているつもりなのですが、
自信がないため総合質問版のほうに書かせていただきました。

コピー＆ペーストで使えるHTMLタグやさんで借りてきたタグなのですが、
そのサイトの“タグ練習場”のようなところではきちんと作動するのに、
自分のエディタに持ち帰って貼り付けると、うまくいかなくなります。

プルダウンで選択して、隣の「GO」ボタンで飛ぶようにしたいのですが、
選択までは問題ないもののGOボタンを押しても何も起こりません。

検索をかけて他のサイトを参照したりしましたが、
いじってみてもやはり変わらずで、理由がわからないのです。

初歩的な質問かもしれませんが、
よろしければご教授お願いいたします。

ちなみにうまくいかないソースが以下のこれです↓

<table><tbody><tr><td>
<div style="color:#fff;text-align:center;font-size:13px">

<div style="margin:0px 0 0 15px;background:white;padding:0px;width:100px"><div style="border:1px solid white;padding:0px 0px"><a href="http://www.geocities.jp/mima9424/" style="color:#fff;text-decoration:none">

<img src=http://www.geocities.jp/mima9424/new-img/logo.jpeg border=0>

</a></div></div>

<div style="margin:0px 0 0 15px;background:white;padding:0px;width:100px"><div style="border:1px solid #fff;padding:0px 0px">


<table><tbody><tr><td>
<form name="me1">
<select name="me2" style="font-size:11px;font-weight:bold;color:#c0c0c0;background:#fff">
<option value="http://geocities.yahoo.co.jp/dr/view?member=mima9424">●ひとり遊び(詩)●
<option value="http://www.geocities.jp/mima9424/link.html">リンクページ
<option value="http://www.geocities.jp/mima9424/nandemonai-okuzyou2.html">なんでもない屋上(色々)
<option value="http://www.geocities.jp/mima9424/turedure.html">つれづれなるままに(雑記)
<option value="http://www.geocities.jp/mima9424/tubuyaki.html">呟き、緑茶を片手に(感想)
<option value="http://geocities.yahoo.co.jp/gl/mima9424">おぼろ月の楽屋(日記)
<option value="http://www.geocities.jp/mima9424/all-poems.html">詩の宝庫(過去の作品)

</select>
</form>
</td><td valign="top">
<div style="border:1px solid #000">
<input type="button" onclick="location.href=document.me1.me2.value" value="ＧＯ!" style="font-size:11px;font-weight:600;border-width:1px;border-style:solid;border-color:#fff #b0b0b0 #b0b0b0 #fff;background:#c0c0c0;color:#fff">
</div>
</td></tr></tbody></table>

1 名前： mima ： 2006/01/04 05:19: ｛訂正｝

ごめんなさい。

「プルダウンがうまく作動しない」というものから
「プルダウンが（リンク先を別フレームに指定したとき）うまく作動しない」に
訂正させてください。
ややこしくて申し訳ありません。

ターゲット指定の仕方が違っているのかもしれませんが、
他サイトなどを参照したところでは、どこが間違っているのか分かりません。

先ほど書きましたように、「GO」ボタンを押しても何も起こりません。

ソースも少し違っていたので改めて載せます。

<table><tbody><tr><td>
<form name="me1">
<select name="me2" style="font-size:11px;font-weight:bold;color:#c0c0c0;background:#fff">
<option value="リンク１">りんく１
<option value="リンク２">りんく２
<option value="リンク３">りんく３

―(略)―

</select>
</form>
</td><td valign="top">
<div style="border:1px solid #000">
<input type="button" onclick="top.1.location.href=document.me1.me2.value" value="ＧＯ!" style="font-size:11px;font-weight:600;border-width:1px;border-style:solid;border-color:#fff #b0b0b0 #b0b0b0 #fff;background:#c0c0c0;color:#fff">
</div>
</td></tr></tbody></table>

です。

フレームは左右に分かれており、プルダウンは左に表示させています。
左側のnameは"2"
右側のnameは"1"としています。

top.1.location.hrefの部分をtop→windowと変えてみたりしましたが、変わりありません。

どなたか、ご教授お願いいたします。

2 名前： とおりすがり ： 2006/01/04 05:19: こんにちは。
フレーム名の先頭が数字なのはいけません。
フレーム名の先頭がアルファベットになるような名前をつけましょう。

これはフレーム名に限らず、name=""やid=""、class名などにも当てはまります。

3 名前： wh ： 2006/01/04 05:19: >>2
ん？そんな制限どこかに書いてありましたか？
（1 だの 2 だのという名前付けが良くないというのは同意）

>>0
> HTMLのみでのプルダウンメニューを使っているつもり

さすがにそれはない。
このままでは、JavaScriptオフの利用者はリンクを辿れず途方に暮れるので
良心的な素材屋なら、その辺の注意点や対策もきちんと書いてあるはず。

<script type="text/javascript">

</script>

<noscript>
<ul>
<li><a href="リンク１">りんく１</a></li>
<li><a href="リンク２">りんく２</a></li>
<li><a href="リンク３">りんく３</a></li>
</ul>
</noscript>

# HTMLをご存知なら、何がタグでどこがスクリプトかの区別は付くはずですが。

4 名前： mima ： 2006/01/04 05:19: できました！
ありがとうございます。

とおりすがり　さんの仰るように、フレーム名が1,2だったのをアルファベットに
変えてみましたら解決いたしました。
idやclassなどにおいても同じとのこと、勉強になりました。
ありがとうございます。

>>whさん
元来のタグにscriptの記述がなかったことで、全てHTMLだと思い込んでしまいました。
HTMLの知識もそれほど無く、javascriptが何たるかもまだよく理解していないため混同してしまいました。
JavaScriptオフの利用者への対策については、素材屋さんのほうでは記述がなかったようですが、
当方のサイトでメニュー選択の術を「リンクをクリック」と「プルダウンメニューから選んでGOボタンをクリック」
の２種類をとっておりますので、それで対策できるのではと考えております。
いささか乱暴なやり方かもしれませんが・・。

貼っていただいたタグ、下側がオフの対策用で、上下とも書くことで
両者に適応できる・・と解釈してしまいましたが
実際にまだ理解が及ばず、申し訳ありません。
ご教授、ありがとうございます。

5 名前： とおりすがり ： 2006/01/04 05:19: >>3

> ん？そんな制限どこかに書いてありましたか？
> （1 だの 2 だのという名前付けが良くないというのは同意）

制限が定められているとかは別に書いてないですけど…
「どこそこに制限が書かれている」などとは、知らないので言えません。
ですが、JavaScriptでのid値、name値、スタイルシートではclass名の先頭が
数字だと動作しないことは経験で知っています。
どこかのサイトで「先頭が数字ではいけない」と書かれていたのも見ましたが、
正直「なぜ数字ではいけないのか」は、当時は知らなくても構わなかったので、
理由が書かれていたかは覚えていません。

よければwh氏が「1 だの 2 だのという名前付けが良くない」理由を、
初心者にも分かりやすく解説してくれませんか。
その解説を、今後の参考とさせていただきます。

6 名前： 横レス ： 2006/01/04 05:19: >1 だの 2 だのという名前付けが良くない」理由

確かここに書いてある事がそれだと思います。
http://www.w3.org/TR/html4/types.html#type-cdata

”ID and NAME tokens must begin with a letter ([A-Za-z]) and...”の部分

7 名前： wh ： 2006/01/04 05:19: >>4
私は「タグ」など貼った覚えはないなあ（苦笑）

>>6
NAMEトークンとname属性を混同してはいけない。
frame要素のname属性の値はNAMEではなくCDATA（XHTML 1.0ではNMTOKEN）
値がNAMEであるname属性は、meta要素くらいしかない。

name属性の値は、個々の要素ごとに調べた方が良い。

>>5
>「先頭が数字ではいけない」と書かれていた

frame要素のname属性の値は、CDATAの場合でもNMTOKENの場合でも、先頭が数字で構わない。

しかし、a要素のtarget属性には
http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/types.html#type-frame-target
のような制限がある。つまり、target属性で先頭が数字の名前を指定することができないために
結果としてframe要素のname属性もそれに合わせるしかない、ということに過ぎない。

したがって、もしもa要素のtarget属性を使わずに、スクリプトだけで
ページ移動するなら、frame要素のname属性値が数字で始まっても構わない。

> JavaScriptでのid値、name値、スタイルシートではclass名の先頭が
> 数字だと動作しないことは経験で知っています。

そんなことは無い。

確かに、id属性の値はIDであるから、先頭に数字が来てはいけない。
id属性と名前空間を共有するname属性（a|form|frame|img要素など）も然り。

しかし、フォーム部品（input|select|textareaなど）や、paramなど雑多な目的で使われるname属性、
およびclass属性については、値はCDATAで、特に制限が無い。
極端な話、文字コードさえ制御できるなら日本語だって使って構わない。

JavaScriptの識別子にはアルファベット、数字、_、$が使える（UTF-8が保証されるなら日本語も可）。
ただし先頭に数字が来てはならない。
http://www2u.biglobe.ne.jp/%7Eoz-07ams/prog/ecma262r3/7_Lexical_Conventions.html#section-7.6

だから、elements.0123部品名という書き方はできない。
しかし、elements['0123部品名'] ならば識別子ではなく文字列にすぎないので許容される。
（ただし数字だけだと配列番号と衝突する。）

そもそも、document.me1.me2.value や top.frame1 のような、問題が生じやすい古い省略をすべきではない。
document.forms['me1'].elements['0123me2'].value、top.frames['0123frame1']と面倒でも省略せずに書けば、
（数字だけの場合を除けば）何の問題も生じない。

8 名前： とおりすがり ： 2006/01/04 05:19: >>6
なるほどです。
ありがとうございました。

ただこれをどう書けば初心者にも分かりやすいのか…（私自身ちゃんと理解できているか…汗

「フレーム名の先頭が数字なのはいけません。」ではなく
「フレーム名の先頭が数字なのは避けましょう。」で通じるかしら…？

9 名前： wh ： 2006/01/04 05:19: >>8
繰り返すが、>>6はframe要素のname属性に対する制限ではない。

# まあ、もうどうでも良いか。

10 名前： とおりすがり ： 2006/01/04 05:19: >>9
すみません。>>7のwh氏宛でした。
アンカー間違えました。ほんとにほんとにすみません（＞＜；