5

我知道这是一个重复的问题，但我无法让它运行。我尝试了我在 SO 和谷歌搜索中找到的所有解决方案......

我的页面中有这个单选按钮表单。我想要的是，当用户选择“只有一个与会者”选项时，一个文本字段只出现在这个选项中。如果用户选择另一个它消失。

正常形式

一旦用户只选择一个选项，就会出现文本框。

扩展形式

我一直在尝试使用 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 文件是否已加载。我还尝试将 javascript 代码放在表单所在的 html.erb 文件中，在单独的 .js 文件和 application.htm.erb<head></head>部分中，但没有运气。为了工作，我需要将代码的每一部分准确地放在哪里？

使用 Rails 3.0.4、Ruby 1.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>

问：

$(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 回答