こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

締切り済みの質問

フォーム選択後のリンクを作る方法

以下のようなプルダウンメニューを作りましたが

例えば 【トヨタ】を選択すると同時に指定のアドレスへリンクさせるためにはどうしたら良いのでしょうか?

わかる方よろしくお願いします。


<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>

投稿日時 - 2007-09-23 23:51:11

QNo.3371112

すぐに回答ほしいです

このQ&Aは役に立ちましたか?

2人が「このQ&Aが役に立った」と投票しています

-広告-
-広告-

回答(5)

ANo.5

おはようございます。回答者:maoo2022 です。

私もやっと今、ブログへの搭載をおわり来てみました。

なんか変・ですね。

?マークはなぜついているのでしょう。

デスクトップでの試験ではどうだったのかな。

?マークが取れないと多分リンク機能が無効のままだと思います。

私も設置の際に、少し変だなと思われることが一点ありました。
最初テストでタグを貼り付け、OKだったので(左サイドバー最下部)残したまま現在の位置に貼り付け動作確認を行ったところリンク機能が無効というか動きませんでした。
最初のタグを隠しファイル(非表示)に設定をしなおし確認したらOKでした。
考えますに、この(text/javascript)は競合の関係で何か問題があるのではと、今思案中です。

TAG indexの各種掲示板です。
http://www.tagindex.com/bbs/index.html

セレクトボックスでリンクする(選択のみ)
http://www.tagindex.com/javascript/link/select1.html

上記のURLを参照、願います。

投稿日時 - 2007-09-25 03:40:20

ANo.4

おはようございます。回答者:maoo2022 です。
質問の内容でHTMLタグのサンプルが出来ました。
----------------------ここから-----------------------------------------
<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>
----------------------ここまで------------------------------------------
このタグをペーストしてUTF-8で[任意の名前.htm]ファイルで
保存して、デスクトップで開き確認してみてください。
*このタグはmaoo2022もブログで使用の予定です。

投稿日時 - 2007-09-24 09:38:50

補足

やってみましたがこんな感じになります
http://techno777.com/sample.html
こういう場合はどうやったらいいのでしょうか?

ナンカ変な感じになっちゃうんですが(汗

投稿日時 - 2007-09-24 10:55:42

ANo.3

求めて居られるものかは不明ですが・・・リンクは正常にします。
------以下----------------------------------------------------
<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 でした

投稿日時 - 2007-09-24 02:02:09

ANo.2

>指定のアドレスへリンクさせる

の意味がよくわからないのですが、単純に飛ばしたいなら
以下のようにしてください。
もっと複雑なことをやる場合は、関数化したほうがよいかもしれませんね。

<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>

投稿日時 - 2007-09-24 00:28:40

補足

ありがとうございます!!

求めていたものはこの方法です!!

しかし、携帯(AU)で見るとプルダウンメニューがラジオボタンに変換されて表示されてしまいます。

その場合の対処策っていうのはどの様になるかご存じないでしょうか?

投稿日時 - 2007-09-24 01:36:12

お礼

上記 間違いです <form>タグを入れ忘れてました!

しかし<form>~</form>で囲って表示させた所プルダウンメニューは表示されたのですが、リンク先に飛びません。

機種はAU W52Tです

なんでかなぁ?

投稿日時 - 2007-09-24 01:44:22

ANo.1

以下のページがそのまま回答になると思います。

極短JavaScriptでプルダウンメニューを作る - [ホームページ作成]All About
http://allabout.co.jp/internet/hpcreate/closeup/CU20070316A/

onChangeイベント発生時にlocation.hrefで移動するだけなので説明不要ですね(汗;

参考URL:http://allabout.co.jp/internet/hpcreate/closeup/CU20070316A/

投稿日時 - 2007-09-24 00:25:15

-広告-
-広告-

あなたにオススメの質問

-広告-
-広告-