![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?5a7ff87)
どういう風に検索かければ言いかわかりませんでした。
フレーム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>
この場合ボタンが二つ表示されるのですが、ここをボタンひとつでこの二つの処理を同時に実行させたいのです。
お力お貸しください。
No.2ベストアンサー
- 回答日時:
取りあえず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>
こんなに変わってしまうんですか?
ありがとうございます。参考にさせていただきます。
フレーム1がちょっと変わるだけだと思ってましたww
フレームとフレーム2部分まで変わってしまったんですね♪
ありがとうございました★
No.3
- 回答日時:
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の方法が全てではありません。
ご参考まで。
>少なくとも<frame>と<form>の違いくらいは覚えておいて損はないでしょう。
間違えてましたねww
<input type="button" value="ボタン1" onclick="window.parent.frame2.document.getElementById('txt1').value='おはようございます。';window.parent.frame2.document.getElementById('txt2').value='おやすみなさい。';">
こういうのを期待してました♪
動かないですけど。。
No.1
- 回答日時:
フレーム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に表示されるんですけど、ボタンを二つ押さないと両方に書き込みできません。
なので、ボタンひとつで両方に書き込みしたいのです。
お願いします。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript javascriptのちょっとした動作不良(原因は突き止めたのですが) 1 2023/06/15 19:58
- JavaScript jsで質問です。 ボタンが二つ存在し、両方のボタンがクリックされたことをチェックしたいのですが、どの 4 2022/11/22 10:30
- JavaScript Javascriptが機能せず原因が分からないので教えて頂きたいです 3 2023/06/04 14:50
- JavaScript コードレビューをお願いします。 1 2022/07/16 05:38
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- JavaScript javascriptでテーブルに追加した項目のid追加してローカルストレージを操作したい 5 2023/01/01 15:52
- JavaScript javascriptで移動ボタンを押した際に遷移するボタンを追記したい 1 2022/11/29 03:02
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
- HTML・CSS ボタンをクリックした時に、入力フォームのすぐ下部に、「入力欄が空白です」というテキストメッセージが表 1 2022/04/27 16:25
- JavaScript javascript作成してます。ラジオボタンで判定するコードを書いてます。 1 2023/07/18 11:03
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
onchangeイベントを強制的に発...
-
onclickが動作しない
-
【javascript】ボタンクリック...
-
javascriptでtextareaに文字列...
-
JSのボタンを複数う使うには
-
文字をテキストフィールドに記...
-
JavaScriptのfileオブジェクト...
-
ボタンをクリックするとテキス...
-
プログラムで困っています!
-
このJavaScriptはなんか早い・・・
-
jsと<audio>タグについて
-
JavaScriptなどでみられるstrと...
-
HTMLとJavaScriptのエラーコー...
-
<textarea>の最後尾に追加した...
-
コードレビューをお願いします。
-
for ( i = 0; i ・・の使い方?
-
計算の結果、整数でも小数点以...
-
SubとEnd Subについて
-
JSやVBSで、ボタンを押す...
-
JavaScriptの勉強をしているの...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
onchangeイベントを強制的に発...
-
クリックさせたいが、click()が...
-
onclickが動作しない
-
追加ボタンを押した際に ok ボ...
-
javaScriptの変数をJavaの変数...
-
innerHTML内では改行は禁止?
-
formのfileの値をhiddenでも持...
-
ボタンかリンクをクリックする...
-
JavaScriptのfileオブジェクト...
-
onClickがinput type="image"だ...
-
javascriptで作成されたテーブ...
-
開いた子ウィンドウにあるボタ...
-
コードレビューをお願いします。
-
ボタンをクリックするとテキス...
-
ポップアップブロックにならな...
-
VB.NETで<Input>タグ、<text...
-
ボタンをクリックして文字を置...
-
テキストフィールド未入力の場...
-
URL 判定
-
javascriptでtextareaに文字列...
おすすめ情報