5

これが繰り返される質問であることは知っていますが、実行させることはできません。私はここで見つけたすべての解決策をSOとグーグルで試しました...

私のページにはこのラジオボタンフォームがあります。私が欲しいのは、ユーザーが「1人の出席者のみ」オプションを選択すると、このオプションに対してのみテキストフィールドが表示されることです。ユーザーが別のものを選択すると、それは消えます。

通常の形式

ユーザーがオプションを1つだけ選択すると、テキストボックスが表示されます。

拡張フォーム

私はjavascriptでやってみました。このコードを使用します

<script>
    $(document).ready(function()
        $("#send_to_one").hide();
        $("input:radio[name="people"]").change(function(){  
          if(this.checked){
            if(this.value =='one'){
              $("#send_to_one").show()
            }else{
              $("#send_to_one").hide();
            }
         }
    }
  });
</script>

フォームのコードは

  <div id="send_to">
    <input type="radio" id="send_poll" name="people" value="all" checked="checked">all the attendees</br>      
    <input type="radio" id="send_poll" name="people" value="one" >only one attendee<br/>
    <div id="send_to_one">
      <label>Write the attendee's name: </label><input type="text" id="attendeename"><br/><br/>
    </div>
    <input type="radio" id="send_poll" name="people" value="group">a group of attendees</br>              
  </div>    

javascriptファイルがロードされていることを確認しました。また、フォームがあるhtml.erbファイル内の別の.jsファイルとapplication.htm.erbの<head></head>セクションにjavascriptコードを配置しようとしましたが、うまくいきませんでした。動作させるために、コードの各部分を正確にどこに配置する必要がありますか?

Rails 3.0.4、Ruby1.8.9を使用します。私もJQueryを使用しています

4

2 に答える 2

4

LIVE DEMO

HTML:

<div id="send_to">
  <input type="radio" id="send_poll" name="people" value="all" checked="checked" />all the attendees<br/>      
  <input type="radio" id="send_poll" name="people" value="one" />only one attendee<br/>
  <div id="send_to_one">
      <label>Write the attendee's name: </label><input type="text" id="attendeename" /><br/><br/>
  </div>
  <input type="radio" id="send_poll" name="people" value="group" />a group of attendees<br/>              
</div>

jQ:

$(document).ready(function(){

    $("#send_to_one").hide();

    $("input:radio[name='people']").change(function(){  

            if(this.value == 'one' && this.checked){
              $("#send_to_one").show();
            }else{
              $("#send_to_one").hide();
            }

    });

});
于 2013-03-25T08:51:04.753 に答える
1
$(document).ready(function() {
    $("#send_to_one").hide();
    $("input:radio[name='people']").change(function(){  
         if(this.checked){
            if(this.value =='one'){
              $("#send_to_one").show()
            }else{
              $("#send_to_one").hide();
            }
         } 
    });
});

コードは正しかったのですが、中かっこ、角かっこ、エスケープされていない引用符がいくつか欠落しています。何らかの形のスマートJavaScriptエディターを使用していますか?あなたが本当にすべきだから...

http://jsfiddle.net/7yt2A/

于 2013-03-25T08:50:27.017 に答える