ベストアンサー

ラジオボタンとドロップダウンの連動について

2005/03/30 16:51

ド素人の初心者ですが、必要に迫られて困っております。過去ログを探してみたのですが、見当たりませんでした。既出でしたら申し訳ありませんが、よろしくお願い致します。 --------- ２つの項目からラジオボタンで選択後、 ○リンゴ　○バナナドロップダウンでそれぞれ　リンゴの場合→１個・２個　バナナの場合→１本・２本と表示・選択するようにできますでしょうか。またさらに、その下にドロップダウンを作成し、（項目内容：現金・カード）リンゴ・１個・現金　の場合は１００円と表示リンゴ・１個・カードの場合は１０５円と表示リンゴ・２個・現金　の場合は２００円と表示リンゴ・２個・カードの場合は２０５円と表示バナナ・１本・現金　の場合は２０円と表示バナナ・１本・カードの場合は２５円と表示 ... といった感じにすることはできますでしょうか。回りくどい感じで大変申し訳ございません。よろしくお願い致します。

falc
お礼率84% (11/13)

JavaScript
回答数3
ありがとう数1

みんなの回答 （3）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

BLUEPIXY
ベストアンサー率50% (3003/5914)

2005/03/30 22:05 回答No.1

やり方は色々あると思いますが、とりあえず動くサンプルを作ってみました。 IEとFireFoxで動作確認しました。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=SHIFT_JIS"> <title>ラジオボタンでセレクトリストの表示を変更する</title> <script type="text/javascript">  </script> </head> <body onload="update(document.FORM1)"> <form name="FORM1"> <label><input type="radio" name="kind" value="apple" checked onclick="updateKind(this.form)">リンゴ</label> <label><input type="radio" name="kind" value="banana" onclick="updateKind(this.form)">バナナ</label> <select name="Number" onclick="updateNumber(this.form)"> <OPTION VALUE="1">１個 <OPTION VALUE="2">２個 <OPTION VALUE="3">３個 <OPTION VALUE="4">４個 <OPTION VALUE="5">５個 </select> <br> <select name="Pay" onclick="updatePay(this.form)"> <OPTION VALUE="cash">現金 <OPTION VALUE="card">カード </select> <input type="text" name="price" size="10" value="100" readonly>円 </form> </body> </html>

質問者

お礼 2005/03/31 13:31

ありがとうございます！こんなにすばらしい回答をいただけるなんて、思ってもみませんでした。ぜひともすぐに応用させていただきます。本当に本当にありがとうございました。またよろしくお願い致します（*^^*)

ログインすると、全ての回答が全文表示されます。

その他の回答 (2)

BLUEPIXY
ベストアンサー率50% (3003/5914)

2005/03/31 18:07 回答No.3

>onclickで取れないのでonchangeを利用する手もあります ryk1234さんの言われてる通りですね。ご指摘ありがとうございます。自分でも指摘を・＞selectForm.options[i].text=(selectForm.options[i].text).charAt(0) + Count[Kind]; は、個数が１桁であることを想定しています。selectのoptionの数があらかじめ判っているから決め打ちでもいいのでしょうが、通常２桁以上の場合も考慮するべきです。上記の部分を var len; len = selectForm.options[i].text.length; selectForm.options[i].text=(selectForm.options[i].text).substr(0,len-1) + Count[Kind]; に置き換えて下さい。

ログインすると、全ての回答が全文表示されます。