- 締切済み
フォーム選択後のリンクを作る方法
以下のようなプルダウンメニューを作りましたが 例えば 【トヨタ】を選択すると同時に指定のアドレスへリンクさせるためにはどうしたら良いのでしょうか？ わかる方よろしくお願いします。 <select name="sougoLINK" size="1"> <option value="トヨタ" >トヨタ</option> <option value="日産" >日産</option> <option value="ホンダ" >ホンダ</option> <option value="マツダ" >マツダ</option> <option value="三菱" >三菱</option> <option value="スバル" >スバル</option> <option value="いすゞ" >いすゞ</option> <option value="ユーノス" >ユーノス</option> <option value="スズキ" >スズキ</option> <option value="ダイハツ" >ダイハツ</option> <option value="日本フォード" >日本フォード</option> <option value="日野" >日野</option> <option value="レクサス" >レクサス</option> <option value="その他" >その他</option> </select>
- gekikaraou
- お礼率41% (282/678)
- HTML
- 回答数5
- ありがとう数3
- みんなの回答 （5）
- 専門家の回答
みんなの回答
- maoo2022
- ベストアンサー率59% (110/185)
おはようございます。回答者：maoo2022 です。 私もやっと今、ブログへの搭載をおわり来てみました。 なんか変・ですね。 ？マークはなぜついているのでしょう。 デスクトップでの試験ではどうだったのかな。 ？マークが取れないと多分リンク機能が無効のままだと思います。 私も設置の際に、少し変だなと思われることが一点ありました。 最初テストでタグを貼り付け、ＯＫだったので（左サイドバー最下部）残したまま現在の位置に貼り付け動作確認を行ったところリンク機能が無効というか動きませんでした。 最初のタグを隠しファイル（非表示）に設定をしなおし確認したらＯＫでした。 考えますに、この（text/javascript）は競合の関係で何か問題があるのではと、今思案中です。 TAG indexの各種掲示板です。 http://www.tagindex.com/bbs/index.html セレクトボックスでリンクする（選択のみ） http://www.tagindex.com/javascript/link/select1.html 上記のＵＲＬを参照、願います。
- maoo2022
- ベストアンサー率59% (110/185)
おはようございます。回答者：maoo2022 です。 質問の内容でＨＴＭＬタグのサンプルが出来ました。 ----------------------ここから----------------------------------------- <HTML> <HEAD> <TITLE>総合リンク</TITLE> <SCRIPT TYPE="text/javascript"> <!-- // 設定開始 // （フレームの場合は、表示先のフレーム名を設定してください） // （top を指定すると、フレームの分割を廃止して画面全体で表示します） // （blank を指定すると、新規ウィンドウで表示します） var target = ""; // 設定終了 function jump(){ var url = document.form1.select.options[document.form1.select.selectedIndex].value; if(url != "" ){ if(target == 'top'){ top.location.href = url; } else if(target == 'blank'){ window.open(url, 'window_name'); } else if(target != ""){ eval('parent.' + target + '.location.href = url'); } else{ location.href = url; } } } // --> </SCRIPT> </HEAD> <BODY> <FORM NAME="form1"> <SELECT NAME="select" onChange="jump()"> <OPTION VALUE="">選択してください <OPTION VALUE="http://www.toyota.co.jp/">トヨタ：グローバルサイト <OPTION VALUE="http://www.nissan.co.jp/">日産 <OPTION VALUE="http://www.mazda.co.jp/home.html">マツダ <OPTION VALUE="http://www.mitsubishi-motors.co.jp/">三菱 <OPTION VALUE="http://www.subaru.jp/">スバル <OPTION VALUE="http://www.isuzu.co.jp/">いすゞ <OPTION VALUE="http://www.roadster.mazda.co.jp/">ユーノスロードスター <OPTION VALUE="http://www.suzuki.co.jp/">スズキ <OPTION VALUE="http://www.daihatsu.co.jp/index_f.htm">ダイハツ <OPTION VALUE="http://www.ford.co.jp/servlet/ContentServer?pagename=DFY/JP">日本フォード <OPTION VALUE="http://www.hino.co.jp/j/index.html">日野 <OPTION VALUE="http://lexus.jp/">レクサス <OPTION VALUE="http://www.jada.or.jp/contents/data/ranking/index.php">その他 </SELECT> </FORM> </BODY> </HTML> ----------------------ここまで------------------------------------------ このタグをペーストしてＵＴＦ－８で［任意の名前．htm］ファイルで 保存して、デスクトップで開き確認してみてください。 ＊このタグはmaoo2022もブログで使用の予定です。
- maoo2022
- ベストアンサー率59% (110/185)
求めて居られるものかは不明ですが・・・リンクは正常にします。 ------以下---------------------------------------------------- <HTML> <HEAD> <TITLE>総合リンク</TITLE> <SCRIPT TYPE="text/javascript"> <!-- // 設定開始 // （フレームの場合は、表示先のフレーム名を設定してください） // （top を指定すると、フレームの分割を廃止して画面全体で表示します） // （blank を指定すると、新規ウィンドウで表示します） var target = ""; // 設定終了 function jump(){ var url = document.form1.select.options[document.form1.select.selectedIndex].value; if(url != "" ){ if(target == 'top'){ top.location.href = url; } else if(target == 'blank'){ window.open(url, 'window_name'); } else if(target != ""){ eval('parent.' + target + '.location.href = url'); } else{ location.href = url; } } } // --> </SCRIPT> </HEAD> <BODY> <FORM NAME="form1"> <SELECT NAME="select" onChange="jump()"> <OPTION VALUE="">選択してください <OPTION VALUE="http://www.toyota.co.jp/">トヨタ：グローバルサイト <OPTION VALUE="http://www.nissan.co.jp/">日産 <OPTION VALUE="http://www.mazda.co.jp/home.html">マツダ <OPTION VALUE="../../javascript/index.html">三菱 <OPTION VALUE="../../color/index.html">スバル <OPTION VALUE="http://www.toyota.co.jp/">いすゞ <OPTION VALUE="../../html_tag/index.html">ユーノス <OPTION VALUE="../../stylesheet/index.html">スズキ <OPTION VALUE="../../javascript/index.html">ダイハツ <OPTION VALUE="../../color/index.html">日本フォード <OPTION VALUE="../../stylesheet/index.html">日野 <OPTION VALUE="../../javascript/index.html">レクサス <OPTION VALUE="../../color/index.html">その他 </SELECT> </FORM> </BODY> </HTML> ------------------------以上------------------------------------ お試しください．．．maoo2022 でした
- yambejp
- ベストアンサー率51% (3827/7415)
>指定のアドレスへリンクさせる の意味がよくわからないのですが、単純に飛ばしたいなら 以下のようにしてください。 もっと複雑なことをやる場合は、関数化したほうがよいかもしれませんね。 <form> <select name="sougoLINK" size="1" onChange="if(this.value)location.href=this.value"> <option value="" >選択してください</option> <option value="http://toyota.jp/" >トヨタ</option> <option value="http://www.nissan.co.jp/" >日産</option> <option value="" >以下略・・・</option> </select> </form>
お礼
上記 間違いです <form>タグを入れ忘れてました！ しかし<form>～</form>で囲って表示させた所プルダウンメニューは表示されたのですが、リンク先に飛びません。 機種はAU W52Tです なんでかなぁ？
補足
ありがとうございます！！ 求めていたものはこの方法です！！ しかし、携帯（AU）で見るとプルダウンメニューがラジオボタンに変換されて表示されてしまいます。 その場合の対処策っていうのはどの様になるかご存じないでしょうか？
- ishkkr
- ベストアンサー率46% (35/75)
以下のページがそのまま回答になると思います。 極短JavaScriptでプルダウンメニューを作る - ［ホームページ作成］All About http://allabout.co.jp/internet/hpcreate/closeup/CU20070316A/ onChangeイベント発生時にlocation.hrefで移動するだけなので説明不要ですね（汗；
補足
やってみましたがこんな感じになります http://techno777.com/sample.html こういう場合はどうやったらいいのでしょうか？ ナンカ変な感じになっちゃうんですが（汗