こんなことをやりたい。

テキストボックスには「趣味」を入力する。テキストボックスの脇のリンクをクリックすると、趣味一覧が表示され、ラジオボタンをクリックすると、元のウインドウのテキストボックスにその選択された「趣味」が入っている。

これはむずかしいでしょうか。

#ポップアップウインドウはわかります。
#ラジオボタンをクリックしたときにテキストボックスへという部分がよくわからず。

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

A 回答 (2件)

サンプル用のHTMLを作成してみました。


こんなのでいかがでしょうか?
参考URLに実際に配置しているので、動かしてみてください。

test.htmlから参照をクリックすると、hobby.htmlを開きます。
hobby.htmlでは、openerというオブジェクトで開き元のwindowを参照できます。
選んだら勝手に閉じるようにした方が自然だったのでそうしてみました。

test.html********************
<HTML>
<BODY>
<SCRIPT LANGUAGE=javascript>
function popup(){
open("hobby.html", "hobby", "width=200,height=300");
}
</SCRIPT>
<BR>
<FORM NAME="main">
趣味を入力してください。
<INPUT TYPE=text SIZE=30 NAME=hobby><A HREF="javascript:popup()">参照</A><BR>
</FORM>
<BR>
</BODY>
</HTML>
********************
hobby.html********************
<HTML>
<BODY>
<SCRIPT LANGUAGE=javascript>
function radio_click(sel){
opener.document.main.hobby.value=sel;
close();
}
</SCRIPT>

<INPUT TYPE=radio NAME=hobby value="釣り" onClick="radio_click(this.value)">釣り<BR>
<INPUT TYPE=radio NAME=hobby value="ゲーム" onClick="radio_click(this.value)">ゲーム<BR>
<INPUT TYPE=radio NAME=hobby value="スポーツ" onClick="radio_click(this.value)">スポーツ<BR>
<INPUT TYPE=radio NAME=hobby value="音楽" onClick="radio_click(this.value)">音楽<BR>
</BODY>
</HTML>
********************

参考URL:http://users.goo.ne.jp/sasadora/test.html
    • good
    • 0
この回答へのお礼

素早い回答ありがとうございます。早速活用させていただきます。(^O^)

お礼日時:2001/02/18 09:37

さっきの解答で補足ですが、


ネットスケープでは、FORMタグがないとラジオボタンが
表示されないので、(厳しい)
hobby.htmlでFORMタグで囲む必要があります。
    • good
    • 0

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

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

このQ&Aを見た人はこんなQ&Aも見ています

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

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

Qconfirm の OK、キャンセル 以外の文字を

javascript の confirm  で、OK、キャンセル以外の文字を出す方法を探しています。

「出せません」とか、「showModalDialog を使用し自作のダイアログ」とかしか見つかりません。

JavaScript だけで、出来ないものなのでしょうか?

Aベストアンサー

jQueryUIのDialogでできます。

以下のサイトの下の方に例が載っていて、そのうちDialog3の例で
OK、キャンセル以外の文字を設定しています。
http://stacktrace.jp/jquery/ui/widgets/dialog.html

Javascriptだけで実現していますが、confirmを使っていないので
質問の意図からはずれてるかもしれませんが。

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化したほうが、可読性が高くなると
思います。

QHTMLでテーブルを横に並べる方法

HTMLでホームページを作っています。
テーブルを横に二つ並べたいのですが、二つ目のテーブルはどうしても最初のテーブルの下の段になってしまいます。どうしたら横に並べることができますか?
教えていただければ幸いです。
よろしくお願いします。

Aベストアンサー

2列のテーブルを作ったらいかがでしょうか?
<table>
<tr>
<td>1つめのテーブルに入れる内容</td>
<td>2つめのテーブルに入れる内容</td>
</tr>
</table>

それぞれのテーブルをそのまま使いたいならば、
↑のテーブルのセルの中に、それぞれ入れれば2つ並びます。
<table>
<tr>
<td><table>←1つめのテーブル→</table></td>
<td><table>←2つめのテーブル→</table></td>
</tr>
</table>

QJavaプログラムからポップアップを表示する方法

現在、Javaプログラムにおいて以下のような
ことを実施したいと考えています。

1。画面上(JSP)からSQLで使用する条件を選び、ボタンをクリック
1.JavaからDBにアクセスし、検索結果件数を取得
2.件数をポップアップで表示し、「はい」もしくは「いいえ」を選択することで、処理を続行させるかさせないかを決定

1及び2については問題なく行えるのですが、3のやり方がよくわかりません。

DBの検索結果が仮に3件だとすると、ポップアップで
「3件が選択されました。処理を続行しますか」というメッセージとともに
「はい」、「いいえ」ボタンを表示させます。

ここで表示するポップアップは、できればJavaScriptで行いたいのですが可能なのでしょうか。
もしJavaScriptでなくても、とにかくポップアップが表示できるようにしたいと考えています。

大変恐縮ですが、よろしくお願いします。

Aベストアンサー

補足の方も読ませて頂きました。

> ここで私の不明点として、1つめが(2)から(3)への遷移になります。
> つまり、Javaプログラム本体からJavaScriptを呼び出すこと。

厳密に言うと、JavaからJavascriptを「呼び出す」ことはできません。
JavaおよびJSPは、ブラウザからのHTTPリクエストに対して
応答としてHTML(含Javascript)を「返す」ことしかできません。
そのHTMLを表示してJavscriptを実行するのは、ブラウザの役目です。

syu1219_aさんがおっしゃる「JavaがJavascriptを呼ぶ」というのは
おそらく、Javaが応答を返して自動的にconfirmのダイアログが出て
「はい」か「いいえ」の確認をユーザに促す、ということなのかと
想像します。

それであれば、Javascriptの「onLoad」イベントが使えます。
onLoadイベントは、ブラウザが読み込み終わると発生しますが、
それを<body>タグにつければ、ページ読み込み完了時に
イベントが発生し、希望のfunctionを呼び出すことができます。
以下のようにすれば、ページ表示と同時に確認を行えます。
----------
<html>

<body onLoad="kakunin()">

</body>
</html>
<script language="Javascript">
<!--

function kakunin() {
  var msg = "検索結果は";
  msg += "<bean:write property="kensakuKekka"/>";
  msg += "です。\n処理を実行しますか?";
  if(confirm(msg) == true) {
    :
  }
  else {
    :
  }
  :
}

//-->
</script>
----------

> そして、2つめが(3)から(4)への遷移になります。
> つまり、JavaScriptで選択された結果をJavaプログラムに返すこと。

ブラウザ側からJavaの方へ情報を伝えるには、
入力された値にしろ、押したボタンにしろ、何にしても
<form>に情報を持たせてsubmitで送信するしかありません。
情報を何らかの形でsubmitに載せることになります。

「確認でどちらを選択したか」というプロパティを新たに設ければ
Java側で受け取ることができます。
<input type="hidden">を使い、submitに載せるといいでしょう。
----------
<html>

<form method="post" action="hogehoge">

<input type="hidden" name="sentaku">

</form>

</html>
<script language="Javascript">
<!--

function kakunin() {
  var f = document.forms[0];
  var msg = "検索結果は";
  msg += "<bean:write property="kensakuKekka"/>";
  msg += "です。\n処理を実行しますか?";
  f.elements["sentaku"].value = confirm(msg);
  f.submit();
}

//-->
</script>
----------

あとは、form.actionを書き換えることによって
ちがうActionを呼ぶということもできるでしょう。

補足の方も読ませて頂きました。

> ここで私の不明点として、1つめが(2)から(3)への遷移になります。
> つまり、Javaプログラム本体からJavaScriptを呼び出すこと。

厳密に言うと、JavaからJavascriptを「呼び出す」ことはできません。
JavaおよびJSPは、ブラウザからのHTTPリクエストに対して
応答としてHTML(含Javascript)を「返す」ことしかできません。
そのHTMLを表示してJavscriptを実行するのは、ブラウザの役目です。

syu1219_aさんがおっしゃる「JavaがJavascriptを呼ぶ」というのは
おそ...続きを読む

QHTMLフォームのSELECTの幅を一定にするためには?

HTMLフォームのSELECTの幅を一定にするためにはどのようにすれば
いいのでしょうか?

CSS等で設定できるとありがたいのですが、やり方がわかりません。

Aベストアンサー

<select style="width: 200px">

Qテキストエリアに入力した改行コードを保持したい

テキストエリアにコメントを入力して、その内容をDBに保存し、別ページで表示させる入力ページの作成で、フォーム内に
・テキストエリアを設置
・その下に「プレビュー」ボタンを設置
・その下にプレビューが表示されるエリアを設置
・一番下にsubmitボタンを設置

test1.phpにて
<form name ="form1" method="post" action="test2.php">
<table>
<tr><td>
<text area name ="comment" id ="comment">
</textarea>
</td></tr>
<tr><td>
<a href="javascript:void(0);" onclick="preview_comment(); ">
<img src="preview.jpg">
</a>
</td></tr>
<tr><td>
<span id="preview_comment">
プレビュー
</span>
</td></tr>
</table>
<div><input type="submit" value ="submit"></div>
</form>


head部分に
<script language="JavaScript">
<!--
function preview_comment()
{var comment_details=document.getElementById("comment").value;
document.getElementById("preview_comment").innerHTML=comment_details;
}
//-->
</script>

を設置しました。
テキストエリアにコメントを入力し、改行がある場合はその改行コードを保持した状態がプレビューとして表示され、確認をしてOKだったらSubmit、という処理を考えているのですが、改行コードがなくなってしまいます。

改行コードを維持したままプレビューエリアにコメントを表示させることはできますでしょうか?
どこを修正すればいいか教えて下さい。

テキストエリアにコメントを入力して、その内容をDBに保存し、別ページで表示させる入力ページの作成で、フォーム内に
・テキストエリアを設置
・その下に「プレビュー」ボタンを設置
・その下にプレビューが表示されるエリアを設置
・一番下にsubmitボタンを設置

test1.phpにて
<form name ="form1" method="post" action="test2.php">
<table>
<tr><td>
<text area name ="comment" id ="comment">
</textarea>
</td></tr>
<tr><td>
<a href="javascript:void(0);" onclick="preview_comment(); ">
<img src="p...続きを読む

Aベストアンサー

横からですが、

>上記ですと改行コードが入っていない状態とプレビュー表示が変わりません。
ブラウザによって改行コードが違うことがあるので、\nだけで判断するようにしてあげればよいのでは?

comment_details=comment_details.replace(/\n/g,"<br />").replace(/\r/g,"");

QInner join と Left joinの明確な違いは?

Inner join と Left joinの違いがよくわかりません。
教えてください。

Aベストアンサー

出てくる結果が違います。

テーブル1のフィールド1に、






が、

テーブル2のフィールド1に、






が入力されている場合、

SELECT [テーブル1].[フィールド1], [テーブル2].[フィールド1]
FROM テーブル1 LEFT JOIN テーブル2 ON [テーブル1].[フィールド1]=[テーブル2].[フィールド1];
では、結果は、
テーブル1.フィールド1 テーブル2.フィールド1
1               1
2               2
3               3
4               NULL
5               NULL
6               NULL
の6レコードが出力されますが、

SELECT [テーブル1].[フィールド1], [テーブル2].[フィールド1]
FROM テーブル1 INNER JOIN テーブル2 ON [テーブル1].[フィールド1]=[テーブル2].[フィールド1];
では、結果は、
テーブル1.フィールド1 テーブル2.フィールド1
1               1
2               2
3               3
の3レコードしか出力されません。

出てくる結果が違います。

テーブル1のフィールド1に、






が、

テーブル2のフィールド1に、






が入力されている場合、

SELECT [テーブル1].[フィールド1], [テーブル2].[フィールド1]
FROM テーブル1 LEFT JOIN テーブル2 ON [テーブル1].[フィールド1]=[テーブル2].[フィールド1];
では、結果は、
テーブル1.フィールド1 テーブル2.フィールド1
1               1
2               2
3           ...続きを読む

Qtableのcellpadding="0" cellspacing="0"をCSSで

tableのcellpadding="0" cellspacing="0"をCSSで設定する方法を検索したところ、
border-collapse:collapse;
border-spacing:0;
というアドバイスが記載されていました。
実際に使ってみたのですが、
どうしてもセル余白とセル間隔が発生してしまいます。
どうしたらよいですか。

Aベストアンサー

border-spacingはborder-collapseの値がseparateのときしか有効にならないそうです。
http://www.htmq.com/style/border-spacing.shtml

サンプルが
http://www.htmq.com/style/border-collapse.shtml
にあるので参考にしてください。

# それにしてもこんなプロパティがあるとは知らなかった…

参考URL:http://www.htmq.com/style/border-spacing.shtml

Qtextareaで入力した文字を改行したままで表示したいのですが。

textareaに複数行で入力した文字を改行したままで表示したいのですが
改行されずに表示されます。
改行したままで表示するのはどうすればいいでしょうか?

<HTML>
<HEAD>
<STYLE type="text/css">
<!--
INPUT {font-size: 12px;}
-->
</STYLE>
<SCRIPT language="JavaScript">
<!--
function check(){
var strName;
strName = document.nform.textN.value;
var test = document.getElementById("test");
test.innerHTML = strName;
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<FORM name="nform" >
<textarea cols="30" rows="10" name="textN"></textarea>
<input type="button" value=" 確認 " onClick="check()">
</FORM>
<DIV id="test" style="position:absolute;font-size:24px;">
</DIV>
</BODY>
</HTML>

textareaに複数行で入力した文字を改行したままで表示したいのですが
改行されずに表示されます。
改行したままで表示するのはどうすればいいでしょうか?

<HTML>
<HEAD>
<STYLE type="text/css">
<!--
INPUT {font-size: 12px;}
-->
</STYLE>
<SCRIPT language="JavaScript">
<!--
function check(){
var strName;
strName = document.nform.textN.value;
var test = document.getElementById("test");
test.innerHTML = strName;
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<FORM name="nform" ...続きを読む

Aベストアンサー

function check(){
var strName;
strName = document.nform.textN.value;
var test = document.getElementById("test");
//一応タグを使えないように置き換える
strName = strName.split("<").join("&lt;");
strName = strName.split(">").join("&gt;");
//改行を改行タグに置き換える
strName = strName.split("\n").join("<br>");
test.innerHTML = strName;
}


このQ&Aを見た人がよく見るQ&A

人気Q&Aランキング