• 締切済み

JS初心者です。スクリプトについて教えてください。

JS初心者です。スクリプトについて教えてください。 フォームの作成でラジオボタンとテキストボックスを連動させるにはどうすればよいのでしょうか？ アンケート形式が分かりやすいと思いますが・・・ ↓ラジオボタン 〇みかん 〇りんご 〇その他［ テキストボックス ］ その他にチェックしないとテキストが入れられないようにするには？ 初歩的な質問ですみません。 教えてください。

みんなの回答

  • zeff
  • ベストアンサー率69% (137/198)
回答No.3

他のラジオボタンをクリックしたときに textareaをdisabledに戻す方法で考えてみました。 <script type="text/javascript"> <!-- function Dfalse(){ document.getElementById('hoge').disabled = false; } function Dtrue(){ document.getElementById('hoge').disabled = true; } //--> </script> </head> <body> <form> <p><input type="radio" name="hogehoge" value="みかん" onclick="Dtrue()">みかん</p> <p><input type="radio" name="hogehoge" value="りんご" onclick="Dtrue()">りんご</p> <p><input type="radio" name="hogehoge" value="その他" onclick="Dfalse()">その他</p> </form> <p><textarea id="hoge" disabled></textarea></p> </body> </html>

  • yyr446
  • ベストアンサー率65% (870/1330)
回答No.2

方法はいくらでもあると思うけど、これでいかが、 <input type="radio" name="fruit" value="みかん">みかん</input> <input type="radio" name="fruit" value="りんご">りんご</input> <input type="radio" name="fruit" value="その他">その他</input> <input type="text" id="その他" style="display:none;"></input> <script type="text/javascript" charset="utf-8"> <!-- var fruits = document.getElementsByName("fruit"); for(var i=0;i<fruits.length;i++){ fruits[i].onclick=function(){ if(this.value=="その他"){ document.getElementById("その他").style.display = 'block'; }else{ document.getElementById("その他").style.display = 'none'; } } } // --> </script>

  • norachlo
  • ベストアンサー率100% (10/10)
回答No.1

例えば「その他」を選んだときに テキストボックスが現れるようにしたらどうでしょうか （それ以外のを選んだときは削除）。 ざっと書いただけですが、以下のような感じで大丈夫でした。 <input type="radio" name="fruit" value="orange" onclick="document.getElementById('EDIT').innerHTML = '';">みかん <input type="radio" name="fruit" value="apple" onclick="document.getElementById('EDIT').innerHTML = '';">りんご <input type="radio" name="fruit" value="others" onclick="document.getElementById('EDIT').innerHTML = '<input type=edit>';">そのほか <div id="EDIT" />

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • ラジオボタンの選択によってチェックボックスのチェックできる個数を制限し

    ラジオボタンの選択によってチェックボックスのチェックできる個数を制限したい。 他の方の質問を見たのですがマッチする質問がなかったのでご質問させていただきます。 現在申し込みフォームを作成しているのですが、要件としては、 ラジオボタンの選択によってチェックボックスのチェックできる個数を制限したい。 と思っています。javascriptで実現できると思うのですがなかなかできずに困っております。 ＜ラジオボタン＞ ○りんご　○みかん　○めろん　○すいか ＜チェックボックス＞ □青森産　□愛媛産　□千葉産　□神奈川産 りんごを選んだ人は、チェックボックスで１つしか選択できないようにしたい。 みかんを選んだ人は、チェックボックスで２つしか選択できないようにしたい。 めろんを選んだ人は、チェックボックスで３つしか選択できないようにしたい。 すいかを選んだ人は、チェックボックスで４つ選択できるようにしたい。 可能であれば制限を超えた場合はアラートを上げたいと思います。 ２つまでしか選べませんというように。 大変申し訳ありませんが、参考になるページやソースなどを教えていただければと 思います。よろしくお願い致します。

  • チェックボックスとテキストフィールドを連動させて、Javascriptでチェックをかけたい

    このようなアンケートがあるとします。 //アンケートスタート ●Q1　あなたはJavascriptを使いこなしていますか？ ラジオボタン回答1　使いこなしている ラジオボタン回答2　あまり使いこなしているといえない ラジオボタン回答3　ぜんぜん使いこなしていない ●Q2　Q1で「あまり使いこなしているといえない」 「ぜんぜん使いこなしていない」と回答した方のみお答えください。 その理由はどのようなものですか？ チェックボックス回答1　むずかしい チェックボックス回答2　わかりにくい チェックボックス回答3　そのほか テキストフィールド　そのほかの理由（　　　　　　　） 【送信ボタン】 //アンケートエンド ■上のアンケートでJavascriptを使用して 次のことをしたいのですが、教えてください。 1.Q1の2と3にチェックがあるのに、 Q2に未回答のままフォームデータを送信しようとした場合に、 アラートを表示させたい 2.Q2で3を選んだ人にもかかわらず、 そのほかの理由テキストフィールドに未記入のまま フォームデータを送信しようとした場合、 アラートを表示させたい よろしくお願いします。

  • チェックボックスのチェックした項目の名前を取得したいです。

    チェックボックスのチェックした項目の名前を取得したいです。 HTML+Javascript+CGIでアンケートフォームを作っています。 送信ボタンを押したときに確認画面を表示させたいのですが、チェックボックスの項目をどう扱って良いのかわかりません。 性別を選択するラジオボタンの値の取得（男をチェックしたか、女をチェックしたか）は sex = document.mailform.sex[0].checked ? document.mailform.sex[0].value : document.mailform.sex[1].value このように出来るとのことですが、チェックボックスはどうしたら良いのでしょうか？ 好きな食べ物を聞くチェックボックスで、選択項目に ・リンゴ・バナナ・ミカン・イチゴ を用意し、チェックされた項目を 好きな食べ物：リンゴ イチゴ の用に出力したいと思っています。 よろしくお願いします。

  • チェックボックス/ラジオボタン

    ＣＧＩを勉強中です。 まだ無料で配布されているＣＧＩをカスタムするくらいしかできないレベルです。 今度やりたいのが、チェックボックス/ラジオボタンどじらでもいいのですが、 こちらに送られてくるメールフォームで選択されているものは仮に「Ｙ」 選択されていないものは「Ｎ」という形で受け取りたい場合はどのように したらできるのでしょうか？ よろしくお願いします。 <input type="checkbox" name="みかん" value="みかん" />みかん <input type="checkbox" name="りんご" value="りんご" />りんご <input type="checkbox" name="メロン" value="メロン" />メロン <input type="radio" name="みかん" value="みかん">みかん　 <input type="radio" name="りんご" value="りんご">りんご

    • ベストアンサー
    • CGI
  • jquery.validate.jsについて

    jquery.validate.jsを使用し、エラー付きのフォームを作りました。 チェックボックスのみ、エラーを出すことができません。 jquery.validate.jsはその機能はありませんよね？？ これに追加するか、他の方法をとりたいのですが、どうすればよろしいでしょうか？

  • ラジオボックス・チェックボックス・テキストボックス

    いつも拝見して勉強させていただいています。 勉強不足でうまくjavaがかけないので質問させていただきます。 下記のように機能させたいと考えています。 1.ラジオボックス１とラジオボックス２のみが初めは選択可能。 　他のチェックボックス１～６とテキストボックスは選択不可能。 2.ラジオボックス２を選ぶとチェックボックス１～６が選択可能。テキストボックスは記入不可能。 3.チェックボックス６を選ぶとテキストボックスは記入可能。 配置は以下のような感じになっています。 ○ラジオボックス１ ○ラジオボックス２--- 　　　　　　　　　　　　　　□チェックボックス１ 　　　　　　　　　　　　　　□チェックボックス２ 　　　　　　　　　　　　　　□チェックボックス３ 　　　　　　　　　　　　　　□チェックボックス４ 　　　　　　　　　　　　　　□チェックボックス５ 　　　　　　　　　　　　　　□チェックボックス６----- 　　　　　　　　　　　　　　　　　　　　　　　　　「 　　　　　　　　　　　　　　　　　　　　　　　　　　　 テキストボックス 　 」 下記サイトを参考にしているのですが組み合わせるとうまくできません。 http://phpjavascriptroom.com/?t=js&p=radiocheckbox 初歩的な質問で申し訳ありませんがよろしくおねがいします。

    • ベストアンサー
    • Java
  • PHP フォームについて

    PHP初心者です。HTMLとPHPを使って、アンケートフォームを作っています。 ネットで色々と調べていたのですが、基本の構成がわからないので教えてください。 HTMLとPHPの別々のファイルで構成されているフォームと、HTMLにPHPを書き込みをしてHTMLの１つのファイルで構成しているものなどがありました。どの方法でやるとよいのでしょうか？ また、同じ内容でもPHPの書き方が違うような感じがするのですが、PHPには同じ動作でも沢山の書き方があるのでしょうか？ウェブサイトによって書き方が違うので少し混乱しています。 [アンケートフォーム内容] テキスト・複数行のテキスト・メール・ラジオボックス・チェックボックス・添付ファイル（添付ファイルは難しいのであれば、無しにします）のフォームの部品をいれたいです。 [動作] １、顧客がアンケートフォームの入力 ２、入力内容を私のメールに転送する のシンプルな動作です。 また、ラジオボタンやチェックボックスをつけると、PHPの構文が難しくなるのでしょうか？ 宜しくお願いします。

    • ベストアンサー
    • PHP
  • フォームで入力した値を別のフォームにコピーする

    はじめまして！ javascriptでフォームAに入力した内容を ボタンが押されたら同一ページのフォームBに ペーストされるscriptを作りたいのですが そういったスクリプトを公開しているものがあれば 教えていただきたいです。よろしくお願いいたします。 やりたい事： [フォームA]--------------------- 　お名前：テキスト 　性別：ラジオボタン 　趣味：セレクトボックス 　コメント：テキストエリア 　[コピーボタン]←内容をコピーするボタン -------------------------------- ↓コピーボタンが押されたら↓ [フォームB]--------------------- 　お名前：テキスト 　性別：ラジオボタン 　趣味：セレクトボックス 　コメント：テキストエリア -------------------------------- Aフォームに入力した内容Bフォームに反映される よろしくお願いいたします。

  • radioボタンでも、うまくアラート処理したいのですが・・・

    <SCRIPT LANGUAGE="JavaScript"> <!-- // ヌル及び空欄のチェックを行う function isFilled(elm) { if (elm.value == "" || elm.value == null) return false; else return true; } function isReady(form) { // 名前の空欄のチェックを行う if (isFilled(form.name) == false) { alert("お名前を入力して下さい。"); form.name.focus(); return false; } return true; } //--> </SCRIPT> フォームによるアンケートページを作成しているのですが、 textボックスで回答が書かれていなく、空欄の部分があったら アラートを出し、そのtextボックス部分に戻す、というような 上記プログラムの流れにしています。 textボックスではうまくいくのですが、radioボタンのとき、 うまくいきません(アラートは出るが、フォームに戻らない)。 回避策を教えてください。

  • プルダウンメニューに連動するチェックボックスのdisable切り換え

    こんにちわ。 表記の件ですが、プルダウンメニューに連動するチェックボックスのdisableを切り換えたいと思っているのですが、なかなか上手くいきません・・・。 例えばプルダウンメニューにおいて ・食べ物 ・生き物 ・果物 ・穀物 というようなメニューがあり、さらにチェックボックスとして ・お米 ・りんご ・さかな ・みかん というチェックボックスがあるとします。 この場合、[食べ物]を選択すると全てが選択できるようになり、[果物]を選択すると[りんご]と[みかん]以外は無効(チェックボックスの選択ができない状態)となるスクリプトを作成したいということです。 もし、先行していずれかのチェックボックスが有効になっていて、プルダウンメニューを切り換えた場合はアラートと同時にチェックボックスをリセットするようできると尚素敵です。 皆様のお知恵を拝借できればと思います。 何卒お力添えいただければ幸いです。

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する