- 締切済み
複数ファイルで共通のセレクトメニューを動作させるためには？（ソース付き）
いつも勉強させていただいております。今回は質問をさせていただけないでしょうか。 A.html、B.htmlの両方のファイルの同じ内容のセレクトメニューを 作っています。 A.htmlを起動するとメニューにA.htmlが B.htmlを起動するとメニューにB.htmlを表示したいと思っています。 いろいろな、サイトを見ると下記で問題ないように思いますが動作しません。 何か問題があるのでしょうか？ IE/Firefoxで動作させていと思っています。 <html> <body> <FORM> <SELECT onchange="location.href=this.options[this.selectedIndex].value"> <OPTION value="A.html">A.html</OPTION> <OPTION value="B.html">B.html</OPTION> </SELECT> </FORM> </body> </html> それでは、よろしくお願いします。
- yuka_102
- お礼率0% (3/342)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
みんなの回答
- yuu_x
- ベストアンサー率52% (106/202)
希望の動作にならない原因。 ・onchange 属性は、select 要素の状態が変化したときに発生。ページを（起動？）開いたときには、イベントは起きません。select などの onload がほしいところですが、DOM-Level3 以降とのこと。 ・location.href を書き換えると、ページ自体が切り替わるため、提示されたコードでは、select で選んだページへジャンプという動作になる。恐らく希望の動作とは異なるでしょう。 修正方法の考え方は #1 にありますので省略。 下は参考までに [JavaScript] (DOM Level2 later) window./*@if(1) attachEvent('on'+ @else@*/ addEventListener( /*@end@*/ 'load', function(){ try{ var options = document.forms.namedItem('XXX_FORM').elements.namedItem('COMPRISING_URL').options; var ele = null; for(var i=0; i<options.length; i++){ ele = options.item(i); if(document.URL.match(new RegExp('(?:/|\)'+ele.value+'(?:\\?|$)'))){ ele.selected = true; break; } } catch(e){ alert(e.message); } }, false); [HTML] <form action="#" id="XXX_FORM"> <p> <select name="COMPRISING_URL"> <option value="none" checked>none</option> <option value="A.html">A.html</option> <option value="B.html">B.html</option> </select> </p> </form> ＊表示の関係上全角スペースが入ってるので、使用する場合は置換してください。 ＊フォームなどの名前は適宜 HTML板の回答にもありましたが、サーバスクリプト（PHP など）でできるなら、そちらでした方が良いと思います。
- zxcv0000
- ベストアンサー率56% (111/196)
提示された SELECTリストには初期値の指定が無い様ですが、現在の HTML の名前を初期値にしたいというご質問でしょうか？ だったら、 BODYタグの onload か何かで「現在の HTlMLファイル名と同じ value を持つ OPTIONタグを selected にする」という処理が必要と思います。
