dポイントプレゼントキャンペーン実施中!

どういう風に検索かければ言いかわかりませんでした。
フレーム1と2に分けて、フレーム1でボタンを押すとフレーム2のテキストボックスの中に文字を入力する。という物を作っています。
下記はフレーム1の内容の一部です。本当に簡単な質問だとおもいます。
<frame>
<input type="button" value="ボタン1"onclick="window.parent.frame2.document.getElementById('txt1').value='おはようございます。'">
</frame>
<frame>
<input type="button" value="ボタン2"onclick="window.parent.frame2.document.getElementById('txt2').value='おやすみなさい。'">
</frame>
この場合ボタンが二つ表示されるのですが、ここをボタンひとつでこの二つの処理を同時に実行させたいのです。

お力お貸しください。

A 回答 (3件)

取りあえずIE6ではこんなイメージですかね。


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<HTML>
<head>
<title>frames1.0</title>
<script type="text/javascript">
<!--
window.onload=function(){
frames[0].document.forms[0].elements[0].onclick = function(){
frames[1].document.forms[0].elements[0].value = 'おはようございます。'
frames[1].document.forms[0].elements[1].value = 'おやすみなさい。'
}
}
//-->
</script>
</head>
<frameset cols="50%,50%">
<frame src="frame1.html" name="frame1">
<frame src="frame2.html" name="frame2">
</frameset>
</html>
----frame1.html----
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<head>
<meta http-equiv="Content-Style-Type" content="text/css">
<title>frames1.0</title>
</head>
<body>
<form action="javascript:void(0);" method="GET">
<input type="button" value="ボタン1">
</form>
</body>
</html>
----frame2.html----
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<head>
<title>frames1.0</title>
</head>
<body bgcolor='DarkGray'>
<input name='Content' type='hidden' value=''>
<form action="javascript:void(0);" method="GET">
<input type="text" name="txt1">
<textarea rows="5" cols="38" name="Content"></textarea>
</form>
</body>
</html>
    • good
    • 0
この回答へのお礼

こんなに変わってしまうんですか?
ありがとうございます。参考にさせていただきます。

フレーム1がちょっと変わるだけだと思ってましたww

フレームとフレーム2部分まで変わってしまったんですね♪

ありがとうございました★

お礼日時:2007/05/03 21:10

ANo.2の補足として。



HTMLが正確に書けていないと、JavaScriptが正確に書けていても動きません。

frame1.html、frame2.htmlの内容が変わるのは、
HTMLとして成り立っていないのを修正しているからです。
JavaScript以前の問題ですから、
JavaScriptをやるまえに、HTMLを勉強し直すのがいいと思います。

少なくとも<frame>と<form>の違いくらいは覚えておいて損はないでしょう。


見やすさ云々は抜きにして、
質問のところで書かれているものを元に作ると、以下の様にすることも出来ます。

<input type="button" value="ボタン1" onclick="window.parent.frame2.document.getElementById('txt1').value='おはようございます。';window.parent.frame2.document.getElementById('txt2').value='おやすみなさい。';">

もう少しHTMLやJavaScriptを勉強すれば、
これをどうすれば見やすくなるか、というのは自ずとわかる様になると思います。
ANo.2の方法が全てではありません。
ご参考まで。
    • good
    • 0
この回答へのお礼

>少なくとも<frame>と<form>の違いくらいは覚えておいて損はないでしょう。
間違えてましたねww

<input type="button" value="ボタン1" onclick="window.parent.frame2.document.getElementById('txt1').value='おはようございます。';window.parent.frame2.document.getElementById('txt2').value='おやすみなさい。';">

こういうのを期待してました♪

動かないですけど。。

お礼日時:2007/05/03 22:31

フレーム1をdocument.frames[0]


フレーム2をdocument.frames[1]
としてinputがformに入っているとフレーム1のボタンは
document.frames[0].forms[0].elements[0]
となります。

また、フレーム2のテキストボックスもformに入っているとすると
document.frames[1].forms[0].elements[0]
となりvalueは
document.frames[1].forms[0].elements[0].value
となります。

ここでボタンを押したときの関数を
function aa(){}
とするとフレーム1のボタンのonclickは
document.frames[0].forms[0].elements[0].onclick=aa
となります。
こうするとフレーム1のボタンを押した時の処理をaaの中に書けば良いことになります。
aaの中に
document.frames[1].forms[0].elements[0].value='おはようございます。'
と書くとdocument.frames[1].forms[0].elements[0]はフレーム2のテキストボックスなのでそのvalueが'おはようございます。'になるのですね。

これだと'おはようございます。'しか表示できないのですが、どうしましょうか。
1つのボタンで二つの処理をすると言うことはなんらかの条件が必要だと感じるのですが、質問文からその条件が読み取れないのです。
例えば条件をjyoukenとすると
if(jyouken){//jyoukenを満たしているとき
document.frames[1].forms[0].elements[0].value='おはようございます。'
}else{//それ以外
document.frames[1].forms[0].elements[0].value='おやすみなさい。'
}
となります。

この回答への補足

初心者すぎてわからないので、いま作成してる現状を全部書きます。
----frame.html----
<!DOCUMENT HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN""http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<head>
<title>frames1.0</title>
</head>
<frameset cols="50%,50%">
<frame src="frame1.html" name="frame1">
<frame src="frame2.html" name="frame2">
</frameset>
</html>
----frame1.html----
<!DOCUMENT HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN""http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<head>
<meta http-equiv="Content-Script-Type" content="text/JavaScript">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>frames1.0</title>
</head>
<body>
<frame>
<input type="button" value="ボタン1"onclick="window.parent.frame2.document.getElementById('txt1').value='おはようございます。'">
</frame>
<frame>
<input type="button" value="ボタン2" onclick="window.parent.frame2.document.getElementById('txt2').value='おやすみなさい。'">
</frame>
</body>
</html>
----frame2.html----
<!DOCUMENT HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN""http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<head>

<title>frames1.0</title>
</head>
<body bgcolor='DarkGray'>
<input name='Content'type='hidden'value=''>
<frame>
<input type="text" Id="txt1">
</frame>
<frame>
<textarea rows=5 cols=38 name=Content id="txt2"></textarea>
</frame>
</body>
</html>

これがこれまで作っているすべてです。
掲示板みたいなものを作っています。
これでちゃんとボタンで文字がフレーム2に表示されるんですけど、ボタンを二つ押さないと両方に書き込みできません。
なので、ボタンひとつで両方に書き込みしたいのです。

お願いします。

補足日時:2007/05/03 19:16
    • good
    • 0

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