セレクトの値で子ウィンドウにそれぞれの説明を出すには?

[上に] [前に] [次に]
りん [E-Mail] 2000/06/07(水) 13:50:39
はじめまして、こんにちは。

セレクトボタンをリンクボタンとしてだけ使うものについてはサンプルを
見つけられたのですが、フォームとしての機能も残した上で
(valueはそれはそれで必要という意味)
選択項目についての説明を子ウィンドウを開いて
表示させるにはどうしたら良いでしょうか?

一からスクリプトを書けない初心者なのでいつもサンプルを探してきて
ちょっとだけ変えたりして使っています。
なので、すみませんがサンプルの在処、などあわせて教えていただけると
とてもうれしいです。よろしくお願いします。

おかあしゃん 2000/06/07(水) 16:40:53
はじめまして。

>セレクトボタンをリンクボタンとしてだけ使うものについてはサンプルを
>見つけられたのですが、フォームとしての機能も残した上で
>(valueはそれはそれで必要という意味)

よくわからないのですが、リンクボタンとしては使わないということですか?
option要素をクリックしたときに、別ウィンドウを開くということですか?

りん [E-Mail] 2000/06/07(水) 17:49:28
おかあしゃんさん、はじめまして。コメントありがとうございます。

えと、説明のしかたがうまくなかったようですみませんです。

セレクトボタンの項目を選んだとき、別ウィンドウを表示したいと
いうことなので、リンクはリンクなんですが、セレクトボタンを
クイックリンクボタンとして使うというスクリプトはValueにリンク先
URLを入れてしまいますよね。でも、セレクトボタンのフォームとしての
Valueも必要なんです。・・・さらにわかりにくいですか?すみません。

えっと、入力フォームを作っているんですが、その中のセレクトボタンの
とこで、たとえば血液型A、って選んだらA型の説明が別の小さいウィンドウで
開いて説明を読んでもらって、そのあとフォームを送信してもらう、と
いうような事をしたいんです。
・・・こんな説明でおわかりいただけるでしょうか・・・?

りん [E-Mail] 2000/06/07(水) 17:57:56
おかあしゃんさん、はじめまして。コメントありがとうございます。

えと、説明のしかたがうまくなかったようですみませんです。

セレクトボタンの項目を選んだとき、別ウィンドウを表示したいと
いうことなので、リンクはリンクなんですが、セレクトボタンを
クイックリンクボタンとして使うというスクリプトはValueにリンク先
URLを入れてしまいますよね。でも、セレクトボタンのフォームとしての
Valueも必要なんです。・・・さらにわかりにくいですか?すみません。

えっと、入力フォームを作っているんですが、その中のセレクトボタンの
とこで、たとえば血液型A、って選んだらA型の説明が別の小さいウィンドウで
開いて説明を読んでもらって、そのあとフォームを送信してもらう、と
いうような事をしたいんです。
・・・こんな説明でおわかりいただけるでしょうか・・・?

かえる 2000/06/07(水) 21:22:59
こんな感じでどうですか?

<script language="javascript">
<!--
var str = new Array();
str[1] = "A型についての説明";
str[2] = "AB型についての説明";
str[3] = "B型についての説明";
str[4] = "O型についての説明";
var child;

function showInfo(val){
    var infoMsg = str[val];
    if( typeof(infoMsg) != "string" ) return;
    child = window.open("","childWindow","width=200,height=200,",true);
    var doc = child.document;
    doc.write(infoMsg);
    doc.close();
    child.focus();
}
//-->
</script>
</HEAD>
<BODY onunload="if(typeof(child)=='object') child.close();">
<form name="form1">
血液型:
<select name="select1" onchange="showInfo(this.selectedIndex);">
<option>- 選択 -
<option value="A">A型
<option value="AB">AB型
<option value="B">B型
<option value="O">O型
</select>
<input type="submit" value="送信">
</form>

りん [E-Mail] 2000/06/08(木) 02:10:40
かえるさん、コメントどうもありがとうございます!!

説明のコメント指定のところをURLにするには
str[1] = "abcd.html";
と入れて、
child = window.open(abcd.html,"childWindow","width200,height=200,",true);
で大丈夫でしょうか?

これから試してみます。
もしかしたらまた質問させていただくかもしれませんが、よろしくお願いします。

また、前回の書き込みが2重になってしまって申し訳ありませんでした。>皆様

KK 2000/06/08(木) 13:08:59
はじめまして。こちらのサイトで書き込むのは初めてです。皆様よろしくお願いします。

>説明のコメント指定のところをURLにするには
>str[1] = "abcd.html";
>と入れて、
>child = window.open(abcd.html,"childWindow","width200,height=200,",true);
>で大丈夫でしょうか?

それではダメですね。
かえるさんのスクリプトを参考にして作ってみました。
<script>〜</script>の部分だけ次のように変更してみてください。

-----------------------------------------------------------
<script language="javascript">
<!--
//表示したいURLを配列にいれる
var address = new Array();
address[1] = "./childA.html";
address[2] = "./childAB.html";
address[3] = "./childB.html";
address[4] = "./childO.html";
var child;

function showInfo(val){
    var childAddress = address[val];
    child = window.open(childAddress,"childWindow","width=200,height=200,",true);
    child.focus();
}
//-->
</script>
-----------------------------------------------------------

りん [E-Mail] 2000/06/08(木) 22:32:33
KKさん、コメントどうもありがとうございます!!

昨夜はいろいろ試してはまっていました。
今日は、ちょっと試している時間がないため取り急ぎお礼だけで
失礼します。明日以降、試した結果を報告させていただこうと思ってます。

りん [E-Mail] 2000/06/09(金) 16:16:38
[[解決]]
コメントをくださった皆様

ばっちりでした、うまく動いたようです!
本当にありがとうございました。助かりました。

[上に] [前に] [次に]