「夫を成功」へ導く妻の秘訣 座談会

こんにちわ。
現在開発しているWEBページで、困っています。

まず、最初のページで、フレームが左右に分割しています。
左フレームAはリンクがたくさんはってあります。
右フレームBはトップロゴがあります。
右フレームBのロゴを押すと、右フレームはさらに上下に分割し、上フレームCはヘッダーとして使用し、下フレームDは詳細画面になっています。
左フレームAのリンクを押すと、下フレームDの内容が変わるのですが、フレームが4つ(A,B,C,D)に分割される前に左フレームAのリンクを押してしまうと、新しくブラウザが開かれてしまいます(Targetがないため)

そこで、URLを引数として、上下画面にフレーム分割をするソースに受け取った引数URLをフレームセットで実行できないかと考えました。

・・・がサンプルなどをひっくり返しても、なかなかできません。
どなたかご教授していただけるととても助かります。
よろしくお願いいたします。

このQ&Aに関連する最新のQ&A

A 回答 (4件)

この方法でお気に召すでしょうか。



<!-- main.html -->
<html>
<frameset cols="20%,*">
  <frame name="A" src="a.html" />
  <frame name="B" src="b.html" />
</frameset>
</html>

<!-- a.html -->
<html>
<head>
<script language="JavaScript">
function func( ancObj ) {
  // フレームBがなければ、とりあえず無視
  if ( !parent )
    return false;
  if ( !(parent.B) )
    return false;
  // フレームBの中にフレームDがなければ、フレームBを更新。
  // その際、フレームDの移り先も合わせて送信
  if ( !(parent.B.D) ) {
    parent.B.location.href="b.html?frameD=" + ancObj.href ;
    return false;
  }
  // フレームDがあれば、ハイパーリンクでジャンプさせて良し
  return true ;
}
</script>
</head>
<body>
  <a href="http://www.yahoo.co.jp/" target="D"
    onclick="return func(this)">Yahoo!</a><br />
  <a href="http://www.google.com/" target="D"
    onclick="return func(this)">Google</a><br />
</body>
</html>

<!-- b.html -->
<html>
<body>
  <a href="b2.html">さらに分割</a>
</body>
</html>

<!-- b2.html -->
<html>
<script language="JavaScript">
function funcOnLoad( ) {
  var searchs =""; // URLのパラメータ部分
  var key = "" ; // 検索パラメータ
  var keyHead = 0; // パラメータの先頭位置
  var keyTail = 0; // パラメータ+値の終了位置
  var urlOfFrameD = "" ; // フレームDのジャンプ先
  // パラメータ文字列の取得
  searchs = location.search;
  if ( searchs.length == 0 )
    return;
  // frameDというパラメータ検索
  key = "?frameD=" ;
  keyHead = searchs.indexOf( key );
  if ( keyHead < 0 ) {
    key = "&frameD=" ;
    keyHead = searchs.indexOf( key );
    if ( keyHead < 0 )
      return ;
  }
  // 値の終了位置を検索
  keyTail = searchs.indexOf( keyHead + key.length, "&" );
  if ( keyTail < 0 ) {
    urlOfFrameD = searchs.substring(keyHead + key.length);
  } else {
    urlOfFrameD = searchs.substring(keyHead + key.length, keyTail);
  }
  if ( urlOfFrameD.length == 0 )
    return ;
  // ジャンプ
  D.location.href = urlOfFrameD ;
}
</script>
<frameset rows="20%,*" onLoad="funcOnLoad( )">
  <frame name="C" src="c.html" />
  <frame name="D" src="d.html" />
</frameset>
</html>

ちょっと長いですが、順を追うと、まず、main.htmlを表示させます。main.htmlは、フレームで左右にa.htmlとb.htmlとに分割されてます。b.htmlはリンクがあり、選ぶとb2.htmlとなり、その中で上下にc.html、d.htmlとなります。
a.htmlには、リンクがあります。今回、onclick属性をつけて置き、returnします。<a>タグでは、onclickからtrueが戻るとhrefで指定したURLにジャンプします。falseが戻るとジャンプしません。
さて、リンクを押されると、親フレームとフレームBがいるか確認します。いない場合は、今回は何もしません。
次にフレームBにフレームDがいるか確認します。いれば、trueを戻してそのままジャンプさせます。
いない場合、まず、フレームBをC、Dに分割させるため、b2.htmlにジャンプします。この際、<a>タグのhrefで指定していたURLもframeDというパラメータとして渡します。フレームAでの作業はここまでです。この際、trueを戻すと別ウィンドウが開くと思うので、何もさせないためにfalseを戻します。
 次に、C、Dと分割させられたフレームBですが、このとき、HTMLソースは、b2.htmlに切り替わります。<frameset>タグにonload属性があります。<frameset>や<body>にonload属性があると、そのhtmlの表示が完了した際に、その属性の内容が実行されます。
 onload属性内では、まず、このページを表示するためのURLにパラメータがあるか確認します。これは、(windows.)location.searchを調べれば判ります。
次にパラメータにframeDが含まれているか確認にして、あれば、その値(文字列)だけを抽出します。
抽出が終われば、フレームDのURLを変更するだけです。

内容が込み入ってますが、alert()を挟むなどして、順番に追えば、理解出来ると思います。もし、この内容で大丈夫そうと思えたら、構築するシステムに合わせてカスタマイズしてみてください。
    • good
    • 0

ANo.#3の回答したnisikitです。

ソースの訂正です。
a.htmlの13行目あたりの
parent.B.location.href="b.html?frameD=" + ancObj.href ;
となっている箇所は、
parent.B.location.href="b2.html?frameD=" + ancObj.href ;
の誤りです。
誤)b.html -> 正)b2.html です。
    • good
    • 0
この回答へのお礼

思ったとおりに動作しました。
大変感謝しております。
ありがとうございました。

また、上記誤りは気づきました。
大丈夫です。

本当にありがとうございました。

お礼日時:2001/10/29 14:26

・トップロゴを押す前に、左フレームのボタンは押せないようにする。


トップロゴ表示時には1フレームにして、左フレームのボタンも出さない。もしくは、出しておきたいのであれば(押せないのに出しても意味無いと思いますが)クッキーなどで制御。

・ダミーフレームをつくり、最初から4フレームで表示する。

ぐらいしか思いつきません。
    • good
    • 0

答えになってないかも知れませんが、


Cookieを使えば宜しいかと…(^_^;l||)
トップロゴの表示の際、フレームが分割されてないとの情報をCookieに書き込めば、あとはフレームAからCookie参照で制御できると思いますが、いかがでしょうか?
    • good
    • 0

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Qiframeのsrc属性で指定したサーブレットにパラメータを渡す方法

タブがクリックされたらiframeを使用して動的にタブのコンテンツを表示する画面をJSPで作成しています。
このとき、iframeのsrc属性で指定したサーブレットにパラメータを送りたいと思うのですがどのようにすればよいのかわかりません。
<iframe onload="sendParams()" src="..."></iframe>

次のようにFormを定義して、
<form name="testForm" action="...">
<input type = "hidden" name="A" value="XXX">
</form>

onload属性で指定したsendParams()でdocument.testForm.submit()をしてみました。ここで、iframeのsrcとformのactionには同じサーブレットのURLを指定しています。この時、タブをクリックすると、ポップアップで画面が表示されてしまいました。ポップアップではなく、タブの中に表示したいのですが、どのようにすればよいでのでしょうか?

URLパラメータとして、パラメータを送ることも考えたのですが、
URLパラメータには変数を指定できるのでしょうか?
例えば、JSP中に<c:set var="A" value="${param.A}" />
という変数設定をしていた場合、Aという変数をURLパラメータ
で送れるのでしょうか?送ってみたら、"A"という文字列が
送られていました。

上記の問題のため、GETでもPOSTでも送る方法がわかりません。
どちらでもいいので、わかる方がいたらぜひ教えてください。

タブがクリックされたらiframeを使用して動的にタブのコンテンツを表示する画面をJSPで作成しています。
このとき、iframeのsrc属性で指定したサーブレットにパラメータを送りたいと思うのですがどのようにすればよいのかわかりません。
<iframe onload="sendParams()" src="..."></iframe>

次のようにFormを定義して、
<form name="testForm" action="...">
<input type = "hidden" name="A" value="XXX">
</form>

onload属性で指定したsendParams()でdocument.testForm.submit()をしてみました。ここ...続きを読む

Aベストアンサー

なんか質問の意図がよめないので、間違ってるかもしれませんが iframe の name attribute に "view"と置いてやって。 form の target attribute を iframe の name ("view") にすればいいのではないでしょうか?そもそも src = "..." となっていますがそのような書き方は出きるのでしょうか?やったことがないので自分が知らないだけかもしれませんが、window.view.location.href = url; とするんじゃないでしょうか?

Qフレーム間のデータ取得

この様なことは可能でしょうか。
もし可能で在れば方法を教えてください。

投稿型ホームページを考えています。
構成は左右のフレームとし、左がメインで右がサブです。
左右とも部品(html)としたいので、frameを使うことが条件です。

具体的には以下のような内容です。
メインは閲覧者が投稿する内容とし、サブにはその中のキーワードを表示する。
サブに表示したキーワードは後日のために保存しておく。

例えば、メインでしりとりをやらせ、『ん』で負けた人の言葉をサブに表示する。
年に一度グランドチャンピオン大会を実施のため、
取ってあったデータを別途公開する。
(あくまで例えです、申し訳在りませんが実の内容は内緒です)

これから始めるのですが、左のフレームは作れる様な気がします。
グランドチャンピョン大会のために保存していた内容を表示することも出来ると思います。

今考えがまとまらないのが、
メインのテキストをある条件で抽出して、サブのフレームに表示する部分とそれを保存する部分です。
具体的にイメージできないのが、
メインのフレーム内のテキストをどう参照するかということです。

分からないながらに、javaでcopyというようなことをするのかな、とおぼろげに考えています。

兎にも角にも可否が知りたく、可能ならば方法も知りたいです。
長くなりましたが、宜しくお願いします。

この様なことは可能でしょうか。
もし可能で在れば方法を教えてください。

投稿型ホームページを考えています。
構成は左右のフレームとし、左がメインで右がサブです。
左右とも部品(html)としたいので、frameを使うことが条件です。

具体的には以下のような内容です。
メインは閲覧者が投稿する内容とし、サブにはその中のキーワードを表示する。
サブに表示したキーワードは後日のために保存しておく。

例えば、メインでしりとりをやらせ、『ん』で負けた人の言葉をサブに表示する。
年に一度...続きを読む

Aベストアンサー

データ参照の仕方だけ簡単に。

まず、ページ全体をframe.htmとし、左側のフレームの
名前をmain右側をsubとし、それぞれmain.htm,sub.htmを
呼ぶとします。
するとこんな感じで、subからmainを参照可能です。

//frame.htm
<html>
<frameset cols="50%,*">
<frame src="main.htm" name="main">
<frame src="sub.htm" name="sub">
</frame>
</html>

//main.htm
<html>
<body>
<form name="f1">
i1:<input type="text" name="i1" value="データ1"><br>
i2:<input type="text" name="i2" value="データ2"><br>
i3:<input type="text" name="i3" value="データ3"><br>
</form>
</body>
</html>

//sub.htm
<html>
<body>
<form>
<input type="button" value="i1の値" onClick="alert(parent.main.document.f1.i1.value)"><br>
<input type="button" value="i2の値" onClick="alert(parent.main.document.f1.i2.value)"><br>
<input type="button" value="i3の値" onClick="alert(parent.main.document.f1.i3.value)"><br>
</form>
</body>
</html>

すなわち、subにとって親のページのmainという名前の
フレーム(window)にあるdocumentの中のform名f1にある
i~要素の値(value)を参照するわけです。

データ参照の仕方だけ簡単に。

まず、ページ全体をframe.htmとし、左側のフレームの
名前をmain右側をsubとし、それぞれmain.htm,sub.htmを
呼ぶとします。
するとこんな感じで、subからmainを参照可能です。

//frame.htm
<html>
<frameset cols="50%,*">
<frame src="main.htm" name="main">
<frame src="sub.htm" name="sub">
</frame>
</html>

//main.htm
<html>
<body>
<form name="f1">
i1:<input type="text" name="i1" value="データ1"><br>
i2:<input type="text" name="i2" value...続きを読む

QHTMLファイル同士での値渡し

困っています。

HTMLファイルからHTMLファイルへ移動するときに、
HTMLファイル1でJavaScript で算出された値を
HTMLファイル2へ渡して使用したいのです。

showModalDialogだとダイアログにしか渡せないし・・・。
このように、値をそのまま次のページに渡すための方法を教えてください。
お願いします。

Aベストアンサー

すみません。うっかりしてました。

document.write(FORM[v1]);
では、v1を変数と認識してしまうので、エラーになってしまいますね。

document.write(FORM.v1);  // 「FORM.v1」です
あるいは
document.write(FORM["v1"]);
としてください。

QjavascriptでiframeのURL変更は?

javascript初心者ですが、あれこれ悩みながらselect(仮にA)、radio(B)、radio(C)から取得したnameに".html"を足すことで、差し替えたいURLを形成することができました。
A,B,Cの選択を A_B_C.html という形にして それをwindow.open または locationで表示することまではできたのですが、インラインフレームの中にそのURLを表示させたりURLの差し替えをすることができません。
長い間悩みましたが解決できず困っています。

方法をご存知の方がいらっしゃいましたら、ご教授よろしくお願いいたします。




<script type="text/javascript">
<!--
//カラーの取得
function getRadio(colNo){
var col = '';
for(var i = 0; i < colNo.length; i++){
if (colNo[i].checked){
col = colNo[i].value;
break;
}
}
return col;
}

//柄の取得
function getGara(garaNo){
var gara = '';
for(var j = 0; j < garaNo.length; j++){
if (garaNo[j].checked){
gara = garaNo[j].value;
break;
}
}
return gara;
}

function show(url){
var size =document.fm.size.value;
var col = document.fm.col;
var gara = document.fm.gara;
var src = "shohin/";
var url;
var tourl = (src + size + "_" + getRadio(col) + "_" + getGara(gara));

var ifr = document.getElementById("s-box");

if(size==""||col==""||gara==""){
var url = (src+"annai.html");
}

else{
var url = (tourl + ".html");}

ifr.location = url;
}
//-->
</script>
-----------bodyの中--------
<form name="fm"
<select name="size"
<input type="radio" name="col"
<input type="radio" name="gara"

中略

<iframe name="s-box" src=""></iframe>
<input type="button" value="組合せを見る" onClick="show(url)" /></form>

javascript初心者ですが、あれこれ悩みながらselect(仮にA)、radio(B)、radio(C)から取得したnameに".html"を足すことで、差し替えたいURLを形成することができました。
A,B,Cの選択を A_B_C.html という形にして それをwindow.open または locationで表示することまではできたのですが、インラインフレームの中にそのURLを表示させたりURLの差し替えをすることができません。
長い間悩みましたが解決できず困っています。

方法をご存知の方がいらっしゃいましたら、ご教授よろしくお願いいたします。



...続きを読む

Aベストアンサー

iframeのソースを変更するなら、
iframe.location=url;
ではなく、
iframe.src=url;
ですよ。

Qフレーム分割領域のサイズを変更する

HTMLのframesetタグでフレームを分割してHTMLを
表示させることができます。例えば...

<frameset rows="40%,60%">
<frame name="frm_01" target="f_left" src="left.htm">
<frame name="frm_02" target="f_right" src="right.htm">
</frameset>

と記述すると、ウィンドウ左にleft.htmを40%、ウィンドウ右にright.htmを
50%割合で表示します。これらを何かHTML上のボタンをクリックされる
などのイベントが生じた場合に、ウィンドウ分割してある比率を(例:left.htm40%→60%)の
ように変更したいのですが、そのようなことはできないものでしょうか?

Aベストアンサー

parent.document.write('~


');
で、トップのファイルと全く同じで割合を変えたようなのを書くということになるのではないでしょうか。

但し、自動広告とか入っているとうまく行かないでしょうね~きっと。
------------------------------------
以下TOPファイル
------------------------------------

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=shift_jis">
</head>

<frameset cols="80,*">
<frame src="right.html" name="right" noresize>
<frame src="left.html" name="left" noresize>
</frameset>
<noframes>

<body>
</body>
</noframes>
</html>

------------------------------------
以下LEFTファイル
------------------------------------
<html>

<head>
<meta http-equiv="content-type" content="text/html;charset=shift_jis">
</head>
<script language="javascript"><!--
function a(html1, html2) {
parent.document.write('<html><head><meta http-equiv="content-type" content="text/html;charset=shift_jis"></head><frameset cols="150,*"><frame src="'+html1+'" name="left" noresize><frame src="'+html2+'" name="right" noresize></frameset><noframes><body></body></noframes></html>');
}
//--></script>
<body>
<a href="javascript:a(top.left.location.href, top.right.location.href)">abc</a>
</body>

</html>

このあたりが動作的には究極的に一番速い(一瞬で切り替わる)
ので、いかにもフレーム境界位置が「瞬時に」変わると言う
感じになるはずなので、参考にしてやってみてください。
ただし、一方で、動作の安定性が欠けます。広告などがあっ
たり、ある一定以上、フレームページが大きいと挙動不審に
なるとおもいます。個人的にはオススメしないです。

一番安定するのは、CGIや、HTMLへの?つき引数として渡して
それをtarget="_top"で呼び出す方法ですが、スピード的に
「ガクッ」と極端に落ちるので、これらを使ってしまうと、
「フレームの境界位置が変わる」と言う感じにはならないで
しょうね。

ヽ(´ー`) マターリ♪
   〇ヽ
   Л

parent.document.write('~


');
で、トップのファイルと全く同じで割合を変えたようなのを書くということになるのではないでしょうか。

但し、自動広告とか入っているとうまく行かないでしょうね~きっと。
------------------------------------
以下TOPファイル
------------------------------------

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=shift_jis">
</head>

<frameset cols="80,*">
<frame src="right.html" name="right" noresize>
<f...続きを読む

Q複数フレームへ同時にリンクを挿入することはできますか?

ホームページビルダーver.6を使いフレーム3分割のHP作成をしています。
例えばフレーム(1)で設定したリンク先を
フレーム(2)に表示させたい場合、
Targetでフレーム(2)を指定しますよね。
この場合、指定フレームは1つに限られているわけですが、
複数のフレームを指定でき、
それぞれのフレームに違ったページを開くように
設定することは可能でしょうか?
ご教授よろしくお願いいたします<(_ _)>

Aベストアンサー

>1つのフレーム内の1画像に2つのリンクを貼り、

フレーム
<frameset rows=100,50,*>
<frame src=aaa.html name=a>
<frame src=bbb.html name=b>
<frame src=ccc.html name=c>
</frameset>


画像表示用
<img src="xxx.jpg" onclick="parent.b.location.href='a.htm';parent.c.location.href='b.htm';">



こういう意味ですか?

QHTML内でJavaScriptの変数を使いたい

<script language="JavaScript">
<!--
function fnc_prompt(){
var msg;
msg = window.prompt("URL","");
}
//-->

で、msgにURLを代入して、

<form action="&{msg};" method="post">

フォームタグ内でその変数を使いたいのですが可能でしょうか。


よろしくお願いします。

Aベストアンサー

これでどうですか?

<script language="JavaScript">
<!--
function fnc_prompt(){
var msg;
msg = window.prompt("URL","");
// この一行追加
document.form1.action = msg;
}
//-->

formタグには、適当なname属性を追加。
<form action="" name="form1" method="post">

QonClickに複数の関数を挿入する方法

初心者なのですがアニメーションの関数anime1、anime2、anime3を作成し、onClickに下記のように設定しました。
クリックするとアニメーション2つの設定ではは動くのですが、3つ目を設定すると動かなくなります。
通常はこのような設定はしないものなのでしょうか?
教えてください。
よろしくお願いします。
<INPUT type="button" value="START" onClick="anime1(), anime2()">・・・OKです。
<INPUT type="button" value="START" onClick="anime1(), anime2(),anime3()">・・・動きません。

Aベストアンサー

セミコロンでつなぐのが常道ですが、3つ以上なら
別途function化したほうが、可読性が高くなると
思います。

Qsubmitボタンで他のフレームを更新する方法

submitボタンで他のフレームを更新する方法

submitボタンで他のフレームを更新する方法が分かりません。
現在、以下のようなフレーム分けされたページがあります。

<frameset cols="50%,*">
<frame name="AAA" src="A.php">
<frame name="BBB" src="B.php">
</frameset>

ここで、A.php のフォーム内のsubmitボタンクリックのタイミングでA.phpは、
C.phpに遷移するのですが、同時にB.phpもD.phpに遷移させたいです。

方法をご存知のかたがいましたら教えてください。宜しくお願い致します。

Aベストアンサー

ページ移動はlocation.hrefです。

<form action="C.php" target="AAA" onsubmit="top.BBB.location.href='D.php';">

Q複数のボタンを等間隔に、かつ中央に配置する

ホームページで、ボタンを横に3つ等間隔に、適度な余白をもって並べ、
さらにその3つがちょうどページの中央に表示されるようにしたいです。
cssをどのように記述すればいいですか?
↓下記のようなイメージにしたいです。

--------------------
--------------------
    □ □ □  ←これがボタンです


↓htmlファイルです↓
<div class="button">
<input type="submit" value="<< 戻る <<" />
</div>

<div class="button">
<input type="submit" value="選択リセット" />
</div>

<div class="button">
<input type="submit" value=">> 進 む>>" />
</div>

↓CSSファイルです↓
div.button {
padding-right:35px;
float:left;
}

上記設定で、ボタンの左右間隔はいい感じにあいたのですが
全体的に左に寄ってしまってます。

よろしくお願いいたします。

ホームページで、ボタンを横に3つ等間隔に、適度な余白をもって並べ、
さらにその3つがちょうどページの中央に表示されるようにしたいです。
cssをどのように記述すればいいですか?
↓下記のようなイメージにしたいです。

--------------------
--------------------
    □ □ □  ←これがボタンです


↓htmlファイルです↓
<div class="button">
<input type="submit" value="<< 戻る <<" />
</div>

<div class="button">
<input type="submit" value="選択リセット" />
</div>

<div class="button...続きを読む

Aベストアンサー

<div class="button">
<input type="submit" value="<< 戻る <<" />
<input type="submit" value="選択リセット" />
<input type="submit" value=">> 進 む>>" />
</div>

div.button {
text-align:center;
}
div.button input {
margin: 0px 20px;
}


人気Q&Aランキング