フォームを使ったリンクの作成方法とは?

このQ&Aのポイント
  • フォームを使ったリンクの作成方法についてご質問いただきました。
  • セレクトボックスを使用してリンクを作成する方法について説明します。
  • 複数のリンクを切り替えるためのフォームの作り方をご紹介します。
回答を見る
  • ベストアンサー

リンク

フォームを使ったリンクがありましたので、やってみましたらこれは、できました。 それで、「同じページ」で、こんな感じのを、 「別」のを作ろうとしたのですが、できませんでした。 (動作が変でした) 「もう一種類」。別のを作るには、どうしたらいいのでしょうか? よろしくお願いいたします。 (↓これと同じでなくてもいいです) <HTML> <HEAD> <TITLE></TITLE> <SCRIPT language="JavaScript"> <!-- function selLink(){ selurl=document.myform.mysel.options[document.myform.mysel.selectedIndex].value; if (selurl != "" )location.href=selurl; } //--> </SCRIPT> </HEAD> <BODY> <FORM name="myform"> <SELECT name="mysel" onChange="selLink()"> <OPTION value="">クイックリンク <OPTION value="index.html">トップページ <OPTION value="page12.html">解説ページ </SELECT> </FORM> </BODY> </HTML>

質問者が選んだベストアンサー

  • ベストアンサー
noname#84373
noname#84373
回答No.1

onChange="if(this.value) location.href=this.value"

sakura5678
質問者

お礼

<SELECT name="mysel" onChange="if(this.value) location.href=this.value"> したらできました。(^^)/ (*^^)/。・:*:・°★,。・:*:・°☆アリガトー

関連するQ&A

  • セレクトボックスでの結果で画像を変化させるモノを同ページに複数個表示する

    セレクトボックスの結果によって画像を変化させるものを作ったのですが、これが一つのみだと動作したのですが、"同じ条件"で複数個おく方法が分かりません。 ちなみに試したものです。(一つ目すら動作しませんでした。) <HTML> <HEAD> <TITLE></TITLE> <SCRIPT language="JavaScript"> <!-- function changeImage(){ var imgnum = document.forms['myform'].elements['imgselect'].selectedIndex; document.images['myimg'].src = 'test01.jpg'; if(imgnum==0){ document.myimg.src="test01.jpg"; }else if(imgnum==1){ document.myimg.src="test02.jpg"; } } //--> </SCRIPT> </HEAD> <BODY> <CENTER> <!--1つめ--> <IMG src="test.jpg" name="myimg" border=0> <FORM name="myform"> <SELECT name="imgselect" onChange="changeImage(this.options[this.selectedIndex].value)"> <OPTION>イメージ1 <OPTION>イメージ2 </SELECT> </FORM> <!--2つめここから下を追加したことで動作しなくなりました--> <IMG src="test.jpg" name="myimg" border=0> <FORM name="myform"> <SELECT name="imgselect" onChange="changeImage(this.options[this.selectedIndex].value)"> <OPTION>イメージ1 <OPTION>イメージ2 </SELECT> </FORM> <!--ここまで--> </CENTER> </BODY> </HTML> *全く同じ条件のものを複数個並べたいのですが、ただ、「form」 と「画像」の項目を増やすだけではだめなのでしょうか? 自分でもこれじゃまずいんじゃない?とは何となく思うのですが、細かな原因が分かりません。かなりの初心者です。どうすればうまくいくのでしょうか?

  • プルダウンから飛んだページにアクセスする方法

    アクセスする事が出来なくて困っています。初歩的なもので申し訳ないのですが、よろしくお願いします。 <HTML> <HEAD> <TITLE> </TITLE> <script language="javascript"> <!-- function navi(obj) { url = obj.options[obj.selectedIndex].value; if(url != "") { location.href = url; } } //--> </script> </HEAD> <BODY> <form method=post> <select name="navi">  <option value a href="URL">リンク <option value a href="URL">リンク1 <option value a href="URL">リンク2 <option value a href="URL">リンク3 </select> <input type=button value="ジャンプ" onClick="location.href =(this.form.navi.options[this.form.navi.selectedIndex].value)"> </form> </BODY> </HTML>

  • FORMデータを配列としてそうしんしたいのですが・・・

    JavaScriptでセレクトボックス内の値が変化したらもう一つあるセレクトリスト内の値が変更されるように組みました。 以下コード。 ----------------------- <HTML> <head> <script type="text/JavaScript"> <!-- menuItem = [["A","B","C","D","E"],       ["1","2","3"], ["あ","い","う","え","お","か"]]; function setMenuItem(n) { len = document.myForm.works.options.length; for (i=len-1; i>=0; i--) { document.myForm.works.options[i] = null; } for(i=0; i<menuItem[n].length; i++) { document.myForm.works.options[i] = new Option(menuItem[n][i],menuItem[n][i]); } } } //--> </script> </head> <body> <FORM name = "myForm"> <SELECT name="list" onChange="setMenuItem(this.selectedIndex)"> <option value="list1">リスト1 <option value="list2">リスト2 <option value="list3">リスト3 </SELECT> <SELECT name="works[]" MULTIPLE> <OPTION>A <OPTION>B <OPTION>C <OPTION>D <OPTION>E </SELECT> </FORM> </BODY> </HTML> ----------------------- でセレクトリスト内のデータを配列として送信したいのですがうまくいきません。 セレクトリストのnameはworks[]にしたら動作すらしなくなりました。 どなたかご教授願います。

  • プルダウンメニューで選んだリンクを別窓で表示させたい

    こんにちは。 プルダウンメニューで選んでもらうと 選んでもらった日にちのところに飛ぶように作っています。 ★GO★を押してもらった日にちの日記を 別窓で表示させるにはどこに _blank を入れたらいいのでしょうか? よろしくお願いします○┓ペコリ <script language="JavaScript"><!-- function myGo(){ mySelect = document.myForm.myMenu.selectedIndex; location.href = document.myForm.myMenu.options[mySelect].value; } // --></script> <form name="myForm"> <select name="myMenu"> <option value="http://blog.livedoor.jp/***"> ■ブログTOP■ <option value="http://blog.livedoor.jp/01**" > *2/2の日記 <option value="http://blog.livedoor.jp/02**" > *2/3の日記 </select> <input type="button" value="★GO★" onClick="myGo()"> </form>

  • リンク先にまで色変更されたままにしたいのですが。

    以下のようなソースを入れ背景色を変更できるようにしました。 (フレーム1にこのソースを入れフレーム2を変更できるようにしました。) ですが、色変更してもHP内の別のページに行ってしまうとまた、設定する前の状態に戻ってしまいます。 リンク先まで色変更を保ったままにしたいのですがどうすればいいでしょうか?全然わかりません。知ってる方いましたら教えてくださいお願いします。プログラムをどうすればいいのか教えていただけるとうれしいです。 <HTML> <HEAD> <TITLE></TITLE> <SCRIPT LANGUAGE=javascript> <!-- function select1_onchange() { var s = select1.options(select1.selectedIndex).value; if (s == ""){return;} parent.frame2.document.bgColor = s; } //--> </SCRIPT> </HEAD> <BODY> <SELECT id=select1 style="WIDTH: 100px" name=select1 LANGUAGE=javascript onchange="return select1_onchange()"> <OPTION value="" selected>色変えます</OPTION> <OPTION value=red>赤</OPTION> <OPTION value=black>黒</OPTION> </SELECT></P> </BODY>

  • プルダウンメニューのリンクで別ウインドウを開く

    下記のようなプルダウンメニューを作成したのですが、同じウインドウ内でリンクするのではなく別ウインドウで開くようにするにはどこを変更すればよいのでしょうか? head内>>>>>>>>>>>>> <script language="JavaScript" type="text/JavaScript"> <!-- function gotoURL(formName){ var gotoUrl=document.forms[formName].elements[0].options[document.forms[formName].elements[0].selectedIndex].value document.location.href=gotoUrl } --> </script> body内>>>>>>>>>>>>>> <form name="fm0"> <select name="links"> <option selected><ここから選択してください></option> <option value="aaa.html">あああ</option> <option value="bbb.html">びびび</option> </select> <input name="BUTTON" TYPE=BUTTON onClick="gotoURL('fm0')" VALUE="GO!"></form>

  • ドロップダウンメニューによるアイフレームへのリンク

    現在Webサイトを作っています。 ですがドロップダウンメニューからリンクをし、リンク先をアイフレームにするのがうまくいきません。 問題のページのHTML、及びJavaScriptは以下の通りです。 <html> <head> <script type="text/javascript"> <!-- function Mylink(form,sel){ mlink=sel.options[sel.selectedIndex].value; if(mlink!="-"){parent.albumf.location.href=mlink;} } //--> </script> </head> <body> <center> <IFRAME name="albumf" frameborder=0 src="●●.html" scrolling=no allowtransparency=true></IFRAME> <BR> <BR> <FORM method="post"> <select onChange="Mylink(this.form,this)"> <OPTION selected value="-">     * メニュー *</OPTION> <OPTION value="-">------------------------</OPTION> <OPTION value="●●.html">項目1</OPTION> <OPTION value="▲▲.html">項目2</OPTION> <OPTION value="-">------------------------</OPTION> </select> </FORM> </center> </body> </html> JavaScriptに関する様々なページを調べましたが、どうしても自力で解決できませんでした。 どなたか改善方法を教えて下さい。 よろしくお願いします。

  • プルダウンメニューの項目をクリックしてもリンク先に

    <HTML> <HEAD> <TITLE>リンク先をプリダウンメニューで表示したい</TITLE> <SCRIPT LANGUAGE="JavaScript"> <!-- function linkMenu(m) { if(m==0)return; document.form01.url.selectedlndex = 0; if(m == 1) document.location="https://www.google.com/?hl=ja&gws_rd=ssl"; if(m == 2) document.location="http://www.yahoo.co.jp/"; } //--></SCRIPT> </HEAD> <BODY> <FORM NAME="form01"> <SELECT NAME="url" onChange="linkMenu(this.selectedlndex)"> <OPTION>クリックして選択してね <OPTION>e-support <OPTION>Office TAKASAKU </SELECT> </FORM> </BODY> </HTML> 以上ですが  プルダウンメニューの項目をクリックしてもリンク先が開かないのですが!? 何かミスがあるでしょうか!?  宜しくお願いします。

  • メールフォームのソースについて

    メールフォームがうまく作れません。下のソースでおかしなところがあったら 教えていただけませんか?よろしくお願いします。 html> <head> <title>sample</title> <script Language="JavaScript"><!-- function set(sObj) { str = sObj.options[sObj.selectedIndex].value; document.myFORM.action = "mailto:" + str; } // --></script> </head> <body> <form name="myFORM" method="post" action="mailto:abc@***.ne.jp" enctype="text/plain"> <br> <input type="text" value="test" NAME="data"><br> <input type="submit" VALUE="送信"><br> </form> </body> </html>

  • 新しい窓を開く記述がblankで上手くいかないです。

    <!-- function myGo(){ mySelect = document.myForm.myMenu.selectedIndex; top.MainFrame.location.href = document.myForm.myMenu.options[mySelect].value; } // --> 上のJavaScriptで、下のformで選択されたページをMainFrameに表示しています。 今回、選択したページを新しい窓で表示したいのですが、locationの 前にblankを書き加えても飛びません。 どの様に記述すればいいのでしょうか?ご指導よろしくお願いします。 <FORM name="myForm"> <select name="myMenu" onChange="myGo()"> <OPTION value="http://---1">◆1 <OPTION value="http://---2">◆2 <OPTION value="http://---3">◆3 </SELECT> </FORM>

専門家に質問してみよう