- ベストアンサー
フレーム分割表示について
現在、フレームを上下に分割し、検索結果を表示する画面を作成しています。 上のフレームの中でキーワードとサイトを指定して検索し、下のフレームではその検索結果を表示できるようにしたいのですが何度もしたのですが成功しません。どうすれば下のフレームの中に結果を表示できるようになるでしょうか？よろしくお願いします。
- youthful97
- お礼率30% (4/13)
- JavaScript
- 回答数4
- ありがとう数1
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
＞プルダウンを使ってyahooでの結果だけではなくgooやgoogleでの結果を表示 ＞するにどうしたらいいでしょうか 検索先を変えるのなら、スクリプトでセレクタの選択内容を取得して、フォームのactionの値を変更してあげればよいけれど、どうせスクリプトを使うのならフォームを利用するよりも、フレーム内のURLをサーチ付で直接指定してしまったほうがよいと思う。（↓で述べる、キーの問題もあるので…） 各検索サイトのトップページはUTF-8みたいだけど、その後が若干バラけているみたいなので、連続して検索するなら、サーチ部でエンコードも指定しておくほうがよさそう。 また、それぞれのkeyがサイトによって異なるので、URLとあわせてキーも取り替えてサーチ部を作成する感じ。 あと、検索キーが日本語の場合は、キーワードのエンコードも必要になります。 それで、できたURLをフレームのsrcに指定してあげればできないかな？（←未検証）
その他の回答 (3)
- fujillin
- ベストアンサー率61% (1594/2576)
質問の意味が理解できてないけど、やりたいのってこんなこと？ （frameは投稿に面倒なのでiframeで代用） URLは「ttp」→「http」に修正してください。 <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> </head> <body> <div style="height:20%;"> <form action="ttp://search.yahoo.co.jp/search" method="get" target="frame1"> <label>SERCH KEY: <input type="text" name="p"></label> <input type="submit" value="serch"> </form> </div> <iframe width=100% height=80% name="frame1"> </frame> </body> </html>
補足
はい。そうです。ありがとうございます。 あと、追加質問なんですが、プルダウンを使ってyahooでの結果だけではなくgooやgoogleでの結果を表示するにどうしたらいいでしょうか？ 何度も質問すみません。 よろしくお願いします。
- yyr446
- ベストアンサー率65% (870/1330)
こんなの？ <html> <frameset> <frame src="A.html" name="ue"> <frame src="about:blank" name="shita"> </frameset> </html> ---------------- A.htmlの中身 -------------- <body> <form action="検索プログラム" target="top.shita"> キーワード<input type="text" name="keyword"><br> 検索<input type="submit"> </form> </body>
- yyr446
- ベストアンサー率65% (870/1330)
情報が不足しています。 作成したソースコードを提示しないとわかりません。 まる投げ解答をご希望されるにしても、もうちょっと仕様らしき ものをはっきりさせないと．．．．
補足
すみません。ソースはこのようになっています。 フレームで上下に分割はできたのですが、どうすれば下に検索結果が表示されるでしょうか？ <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <title>search site</title> </head> <body> <script type="text/javascript"> <!-- var target = "main"; var site = new Array(); site[0] = ["Goo", "index1.html", "MT", ["from", "USR"], ["IE", "sjis"]]; site[1] = ["Google", "http://www.google.com/search", "q", ["hl", "ja"], ["ie", "Shift_JIS"]]; site[2] = ["Yahoo", "http://search.yahoo.co.jp/bin/search","p",["ei", "Shift_JIS"]]; window.onload = function() { if (!document.createElement) return; if (document.all && !window.clipboardData && !window.opera) return; // 検索サイトのリストを生成 var select = document.createElement("select"); select.id = "addlist"; for (var i = 0; i < site.length; i++) { var opt = document.createElement("option"); opt.value = i; var str = document.createTextNode(site[i][0]); opt.appendChild(str); select.appendChild(opt); } // デフォルトで選択状態にする場合はその配列番号を option[n] に指定 // select.options[3].selected = true; // 既存の検索フォームにこのドロップダウンを追加 var obj = document.forms[0]; obj.elements[obj.elements.length - 1].value = "検索"; obj.insertBefore(select, obj.elements[1]); // フォームが送信された時に selectSearch() を呼び出す obj.onsubmit = selectSearch; } function selectSearch() { var str = document.forms[0].p.value; // 入力された検索文字 var num = document.forms[0].addlist.value; // 選択されたリストの番号 // 選択された検索サイトのフォーム生成（送信先の指定） var setform = document.createElement("form"); setform.action = site[num][1]; setform.method = "GET"; // setform.target = "_blank"; // 検索結果を新しいウインドウに表示する場合に追加 // 検索文字クエリ var query = document.createElement("input"); query.type = "hidden"; query.name = site[num][2]; query.value = str; setform.appendChild(query); // 検索文字以外のクエリ if (site[num].length > 3) { for (var i = 3; i < site[num].length; i++) { var extra = document.createElement("input"); extra.type = "hidden"; extra.name = site[num][i][0]; extra.value = site[num][i][1]; setform.appendChild(extra); } } // 生成したフォームを文末に追加してそのフォームを送信 document.body.appendChild(setform); setform.submit(); // document.forms[document.forms.length - 1].submit(); return false; } 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> <br> <form action="http://search.yahoo.co.jp/bin/search" method="GET"> <input type="text" name="p" value="" size="50" maxlength=255 value="入力して(^0^)/"style="color: #808080; width: 150px;" onFocus="HideFormGuide(this);" onBlur="ShowFormGuide(this);"> <script type="text/javascript"> var GuideSentence = '入力して(^0^)/'; function ShowFormGuide(obj) { // 入力案内を表示 if( obj.value == '' ) { obj.value = GuideSentence; } } function HideFormGuide(obj) { // 入力案内を消す if( obj.value == GuideSentence ) { obj.value=''; } } </script> <input type="button" value="検索" onClick="jump()"> </form> </body> </html>
お礼
ありがとうございます。 試してみたいと思います。