コンボボックスのリンク先にフレームを指定したい
- コンボ1に連動してコンボ2の内容を変更し、コンボ2からリンクしているファイルを別フレームに表示したいです。
- リンク先にアンカーを指定したいです。
- header.htmlのfunction go()～をfunction go(){window.main.location= ～ にしてもNGでした。
- ベストアンサー
コンボボックスのリンク先にフレームを指定したい
コンボ1に連動してコンボ2の内容を変更し コンボ2からリンクしているファイルを別フレームに表示したいです。 また、リンク先にアンカーを指定したいです。 宜しくお願いいたします。 以下の設定で試みましたが、NGでした。 ------------------------------------------------ ◆index.html <html> ～省略～ <frameset rows="120,*" border="0" framespacing="0" frameborder="no"> <frame src="header.html" name="head" noresize scrolling="no"> <frame src="data1.htm" name="main" noresize> ～省略～ </html> ------------------------------------------------ ◆header.html <HTML> <HEAD> <META http-equiv="content-type" content="text/html;charset=x-sjis"> <TITLE>連動コンボ</TITLE> </HEAD> <BODY bgcolor="#ffffff"> <P> <FONT size="2">連動コンボ</FONT></FONT><BR> <FORM METHOD=POST name=doublecombo> <P> <!-- --><SELECT name="example" ID="example" onchange="redirect(this.options.selectedIndex)" size="1"> <OPTION SELECTED>選択 <!--group1--> <OPTION>データ1 <!--group2--> <OPTION>データ2 </SELECT><SELECT name="stage2" ID="stage2"> <OPTION SELECTED VALUE="">- <INPUT type=BUTTON name="test" VALUE="適用" ID="test" onclick="go()"><BR> <SCRIPT> <!-- var groups=document.doublecombo.example.options.length var group=new Array(groups) for (i=0; i<groups; i++) group[i]=new Array() group[1][0]=new Option("data1-1","1-1.html")←●1-1.html#page1 のようにアンカーを指定したい group[1][1]=new Option("data1-2","1-2.html") group[1][2]=new Option("data1-3","1-3.html") group[2][0]=new Option("data2-1","2-1.html") group[2][1]=new Option("data2-2","2-2.html") group[2][2]=new Option("data2-3","2-3.html") var temp=document.doublecombo.stage2 function redirect(x){ for (m=temp.options.length-1;m>0;m--) temp.options[m]=null for (i=0;i<group[x].length;i++){ temp.options[i]=new Option(group[x][i].text,group[x][i].value) } temp.options[0].selected=true } function go(){ location=temp.options[temp.selectedIndex].value } //--></SCRIPT> </FORM></BODY> </HTML> ------------------------------------------------ ◆備考 header.htmlのfunction go()～を function go(){window.main.location= ～ にしてもNGでした。
- indigo45kk
- お礼率71% (53/74)
- HTML
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
> コンボ2からリンクしているファイルを別フレームに表示したいです。 フレーム「main」に表示するならば... location=temp.options[temp.selectedIndex].value ↓ parent.main.location.href=temp.options[temp.selectedIndex].value > ●1-1.html#page1 のようにアンカーを指定したい 下記のように各々変更する group[1][0]=new Option("data1-1","1-1.html") ↓ group[1][0]=new Option("data1-1","1-1.html#page1") 飛んだ先にアンカー（<a name="page1">hoge</a>等）が存在しなかったり、スクロールの必要のないレイアウトになっていれば、もちろん意味はありません。
関連するQ&A
- ２つのプルダウンの結果を別フレームへ
はじめまして。一方のフレームには２つのプルダウンを作りボタンクリックでその結果(リンク)をもう一方のフレームで表示させたいのですが、うまくいかず困ってます。どなたかよろしくお願いします。 それぞれフレームの名前は、 プルダウンのフレーム・・・・・top それを表示させたいフレーム・・und と付けました。 プルダウンの方のソースは以下のようになってます。 <!--webbot bot="HTMLMarkup" startspan --> <form name="doublecombo" > <p><select name="example" size="1" onChange="redirect(this.options.selectedIndex)"> <option>月曜日</option> <option>火曜日</option> </select><br><br> <select name="stage2" size="1"> <option>時限選択</option> </select><br><br> <input type="button" name="test" value="時間割" onClick="go()" > </p> <script> <!-- var groups=document.doublecombo.example.options.length var group=new Array(groups) for (i=0; i<groups; i++) group[i]=new Array() group[0][0]=new Option("１時限","/○○○.html") group[0][1]=new Option("２時限","/○○○.html") group[0][2]=new Option("３時限","/○○○html") group[1][0]=new Option("１時限","/○○○.html") group[1][1]=new Option("２時限","/○○○.html") group[1][2]=new Option("３時限","/○○○.html") var temp=document.doublecombo.stage2 function redirect(x){ for (m=temp.options.length-1;m>0;m--) temp.options[m]=null for (i=0;i<group[x].length;i++){ temp.options[i]=new Option(group[x][i].text,group[x][i].value) } temp.options[0].selected=true } function go(){ location=temp.options[temp.selectedIndex].value } //--> </script>
- 締切済み
- JavaScript
- ホームページビルダーのリンク切れ
ホームページビルダー７を使用しています ビジュアルサイトのリンクされていないＨＴＭＬファイルに下記のＨＴＭＬを使用した場合、リンク切れファイルが存在します。リンクさせるにはどのようにしたら良いのでしょうか。 下記ＨＴＭＬでリンクはできています。 <form name="doublecombo"> <p><select name="example" size="1" onChange="redirect(this.options.selectedIndex)"> <option>名称１</option> <option>名称２</option> </select> <select name="stage2" size="1"> <option value="http://">サブ名称１</option> <option value="http://">サブ名称２</option> </select> <input type="button" name="test" value="Go!" onClick="go()"> </p> <script> <!-- var groups=document.doublecombo.example.options.length var group=new Array(groups) for (i=0; i<groups; i++) group[i]=new Array() group[0][0]=new Option("サブ名称１","http://") group[0][1]=new Option("サブ名称２","http://") group[1][0]=new Option("サブ名称1-1","http://") group[1][1]=new Option("サブ名称1-2","http://")
- 締切済み
- ホームページ作成ソフト
- ２つのコンボボックスの連携
以前このカテゴリで「一方のコンボボックスの選択によりもう一方のコンボボックスの項目を絞り込む」スクリプトを拝見させていただいたのですが、次のとおり作成すると「な行」を選択すると「え」と「な」が選択項目として現れてしまいます。 どこかおかしいところがあるのでしょうがさっぱりわかりません。どなたか教えてください。よろしくお願いします。 ------------------------------------------------ <html> <head> <title>OK WEB</title> <script type="text/javascript"> <!-- txt = {}; txt["1"] = new Array("あ","い","う","え","お"); txt["2"] = new Array("か","き","く","け","こ"); txt["3"] = new Array("さ","し","す","せ","そ"); txt["4"] = new Array("た","ち","つ","て","と"); txt["5"] = new Array("な"); function initMenu(){ var i; for (i=0; i<txt["1"].length; i++){ document.FORM1.MENUB.options[i] = new Option(txt["1"][i],txt["1"][i]); } } function setSubMenu(area){ var i; for (i=0; i<document.FORM1.MENUB.length; i++){ document.FORM1.MENUB.options[i] = null; } for (i=0; i<txt[area].length; i++){ document.FORM1.MENUB.options[i] = new Option(txt[area][i],txt[area][i]); } } // --> </script> </head> <body onload="initMenu()"> <form name="FORM1"> <select name="MENUA" onchange="setSubMenu(this.value)"> <OPTION VALUE="1">あ行 <OPTION VALUE="2">か行 <OPTION VALUE="3">さ行 <OPTION VALUE="4">た行 <OPTION VALUE="5">な行 </select> <br> <select name="MENUB" > <OPTION VALUE="あ">-- </select> </form> </body> </html>
- ベストアンサー
- JavaScript
- phpで作る親子のコンボボックスについて
phpだけでコンボボックスを作りたいのですが良い方法が見つかりません。 javascriptを使う方法は下記サイトに方法が載っているのでわかるのですが、 http://phpjavascriptroom.com/exp.php?f=include/js/selectoption/pulldown.inc&ttl=%E9%80%A3%E5%8B%95%E3%83%97%E3%83%AB%E3%83%80%E3%82%A6%E3%83%B3 post関数を使えば良いと思いますが、ページの移動なく、クリックイベントを条件分岐できないかと思案中です。助言をお願いします。 <?php $titles = array('さんぷる','サンプル'); $example = array('1', '2'); echo '<select name="test">'; foreach ($titles as $key => $sample) { if ($ibanners == $ibanner) { echo '<option name="' . $example[0] . '" value="' . $example[0] . '" selected="selected">' . $sample . '</option>'; } else { echo '<option name="' . $example[1] . '" value="' . $example[1] . '">' . $sample . '</option>'; } } echo '</select>'; $momo = array('さっかー','やきゅう','ばすけ','ごるふ'); $tetsu = array('サッカー','ヤキュウ','バスケ','ゴルフ'); echo '<select name="saikoro">'; foreach($momo as $bonbi) { if ($GODbonbi == $bonbi) { echo '<option name="カテゴリ01" value="' . $bonbi . '" selected="selected">' . $bonbi . '</option>'; } else { echo '<option name="カテゴリ01" value="' . $bonbi . '">' . $bonbi . '</option>'; } } foreach($tetsu as $bonbi) { if ($GODbonbi == $bonbi) { echo '<option name="カテゴリ02" value="' . $bonbi . '" selected="selected">' . $bonbi . '</option>'; } else { echo '<option name="カテゴリ02" value="' . $bonbi . '">' . $bonbi . '</option>'; } } echo '</select>'; ?>
- ベストアンサー
- PHP
- Rails のコンボボックス（select）を生成する時の tabindex 属性の指定の仕方について
Rails でコンボボックスを作るときに下記の記述でタブインデックスの属性が指定できると思っていたのですが、属性が付加されません。 どなたかご教授おねがいします。 <%= select 'data', 'id', {'test1' => 1, 'test2' => 2}, {:selected => 1, :tabindex => 5} %> ※下記のようにソースが生成されてしまって『tabindex』が指定できない <select id="data_id" name="data[id]"><option value="1" selected="selected">test1</option> <option value="2">test2</option></select>
- ベストアンサー
- その他（プログラミング・開発）
- Javascriptのリストボックスのリンクの指定の仕方
Javascriptで2つのリストボックスを作成し、 1つ目のリストボックスで選択した値によって、 2つ目にリストボックスに表示される内容が変わるようにしました。 ソースは以下です。 <script language="JavaScript"> var no = new Array; no[0] = new Array("sample1", "sample2", "sample3"); no[1] = new Array("1sample1", "12sample2", "1sample3"); no[2] = new Array("2sample1", "2sample2", "2sample3"); no[3] = new Array("3sample1", "3sample2", "3sample3"); function Change(n){ a = n.area.selectedIndex; for(i=0;i < 3;i++){ n.country.options[i].text=no[a][i]; } } </script> <form> <select name="リストボックス1" onchange="Change(this.form)"> <option selected="selected">例1 <option>例2 <option>例3 <option>例4 </select> <select name="リストボックス2" size="1"> <option selected="selected">sample1 <option>sample2 <option>sample3 </select> </form> この際に、2つ目のリストボックスで値が選択された 時点で、指定のURLに飛ぶようにしたいのですが、 URLをどこに指定していいのかわかりません。 ご存知の方、宜しくお願いします！
- 締切済み
- JavaScript
- 連想配列を使ってコンボボックスを設定したい
JavaScriptの初心者です。 var cd_0001 = new Object(); cd_0001["0001"]="アフリカ"; cd_0001["0002"]="南アメリカ"; cd_0001["0003"]="カリブ海/南アメリカ"; cd_0001["0004"]="アジア"; cd_0001["0005"]="オセアニア"; 上記のような連想配列があります。 これを使って以下のようなコンボボックスを 作りたいのです。 <select name="cmb"> <option value="0001" selected>アフリカ</option> <option value="0001">フィルター</option> <option value="0002">南アメリカ</option> <option value="0003">カリブ海/南アメリカ</option> <option value="0004">アジア</option> <option value="0005">オセアニア</option> </select> コンボボックスを作成する部分はネットで検索し 見つけました。 ですが、連想配列から全てのKEYと値を 取得することができません。 どのようにすれば取得することができるのでしょうか？ 意味わかりますか？ 説明がわかりにくく申し訳ございません。 よろしくお願いします。
- ベストアンサー
- JavaScript
- セレクトメニューのリンク先を隣のフレームに表示したい。
左側の細いフレームにセレクトメニューを設置しました。 メニューを選んで、go!をクリックして、リンクするときメインのフレームに開くようにしたいのですが・・・。 ターゲットはどこに記述すればよいですか？ お忙しいところ申し訳ありませんが、教えてください。 よろしくお願いします。 ＊head部分の記述 <SCRIPT LANGUAGE="JavaScript"> <!-- function gotoURL(){ var gotoUrl=document.f0.f0e0.options[document.f0.f0e0.selectedIndex].value document.location.href=gotoUrl｝ //--> </SCRIPT> ＊body部分の記述 <FORM NAME="f0"> <div align="center"> <SELECT NAME="f0e0"> <option value="../kensaku/chikukensaku.html" selected>宮崎市</option> <option value="no">延岡市</option> <option value="mj">都城市</option> <option value="kb">小林市</option> <option value="gb">郡部</option> </SELECT> <INPUT TYPE=BUTTON VALUE="GO!" onClick="gotoURL()"> </div> </FORM>
- 締切済み
- JavaScript
- コンボ(?)ボックスの項目の削除方法
タイトルどおりの質問なんですが、 コンボ(?)ボックスのある項目を選択した状態で「削除」ボタンを押すことにより その項目を削除する。というプログラムを作成しています。 ちなみにコードは以下のようになっています。 <INPUT TYPE="BUTTON" name="Catdel" VALUE="削除" onClick="deldata();"> <SELECT Name="Option" MULTIPLE SIZE=10 > <OPTION value="01">１</OPTION> <OPTION value="02">２</OPTION> <OPTION value="03">３</OPTION> <OPTION value="04">４</OPTION> <OPTION value="05">５</OPTION> <OPTION value="06">６</OPTION> <OPTION value="07">７</OPTION> <OPTION value="08">８</OPTION> <OPTION value="09">９</OPTION> <OPTION value="10">１０</OPTION> </SELECT> function deldata(){ ・・・ ・・・ } この function deldata()の中の処理方法について教えてください。 初歩的な質問と思いますが、よろしくお願いします。
- ベストアンサー
- JavaScript
- jquery-コンボボックス-選択状態
3つのコンボボックスをjqueryを使って連動させております。 連動するコンボボックスを選択しボタンを押下すると 自画面へ遷移します。 その際に先ほどの画面で選択したコンボボックスを選択状態に したくて困っております。 html <select name="area" id="parent"> <option value="1">エリアを選択</option> <option value="2">北海道・東北</option> <option value="3">関東</option> ・・・ </select> <select name="pref" id="child"> <option class="sub_1" value="1">都道府県を選択</option> <option class="sub_2" value="1">都道府県を選択</option> <option class="sub_2" value="2">北海道</option> <option class="sub_2" value="3">青森</option> <option class="sub_2" value="4">岩手</option> <option class="sub_3" value="1">都道府県を選択</option> <option class="sub_3" value="14">東京</option> <option class="sub_3" value="15">神奈川</option> ・・・ </select> <select name="region" id="grandsun"> <option class="sub_1" value="1">地域を選択</option> <option class="sub_2" value="1">地域を選択</option> <option class="sub_2" value="0101">札幌</option> <option class="sub_3" value="1">地域を選択</option> <option class="sub_3" value="0201">青森市</option> <option class="sub_3" value="0202">弘前市</option> <option class="sub_3" value="0203">八戸市</option> ・・・ ・・・ </select> function makeSublist(parent,child,isSubselectOptional,childVal){ $("body").append("<select style='display:none' id='"+parent+child+"'></select>"); $('#'+parent+child).html($("#"+child+" option")); var parentValue = $('#'+parent).attr('value'); $('#'+child).html($("#"+parent+child+" .sub_"+parentValue).clone()); childVal = (typeof childVal == "undefined")? "" : childVal ; $("#"+child+' option[@value="'+ childVal +'"]').attr('selected','selected'); $('#'+parent).change( function(){ var parentValue = $('#'+parent).attr('value'); $('#'+child).html($("#"+parent+child+" .sub_"+parentValue).clone()); $('#'+child).trigger("change"); $('#'+child).focus(); } ); } $(function(){ makeSublist('child','grandsun', true, ''); makeSublist('parent','child', false, '1'); });
- 締切済み
- JavaScript
お礼
求める結果を得ることができました。 早急な、わかりやすい回答をありがとうございました。