Question

我有以下方式的radio_button_tag：

 <%= radio_button_tag "content[id]", content.id%><%= content.title %>

并按以下方式使用text_field：

<%= f.text_field :title %>

当我点击单选按钮时，单选按钮的标题应填充在上面的text_field中。我正在尝试使用jQuery。

Answer 1

首先，让我们为你的单选按钮添加一个title属性：

<%= radio_button_tag "content[id]", content.id, {}, {:title => content.title} %><%= content.title %>

前面应该输出一些看起来像这样的HTML：

<input id="content_id_<content.id>" type="radio" value="<content.id>" title="<content.title>" name="content[id]" />

其次，这是jQuery代码：

jQuery(function(){
    // For each radio button whose name is 'content[id]':
    jQuery("input[type='radio'][name='content[id]']").each(function(index, button){
        // Give the button a certain click behaviour:
        jQuery(button).click(function(){
            // Set the value of 'title' textfield to the radio's title
            jQuery("#title").val(this.title);
        });
    });
});

这个匿名函数将在文档加载完成后执行。它将点击行为附加到您的按钮，因此您不需要onclick属性。

（这只会将单击行为添加到单选按钮本身。如果要为每个单选按钮添加<label>元素并赋予它相同的行为，则必须在上述内容中添加一些内容。 jQuery代码。）

Answer 2

不确定红宝石，但在.net中我会在收音机，标签和文本框中加上一个类名。然后我可以用它;

$(document).ready(function(){

  $(".radioClassName").click(function(){

    $(".TextBoxClassName").val($(".radioLabelClassName").text());

  });

});

您的HTML可能如下所示;

<input type=radio class="radioClassName"><label class="radioLabelClassName">my text"</label>

<input type="text" class="TextBoxClassName">

不确定这会起作用，但我认为jQuery是jQuery

Answer 3

假设html为

 <form>
<input type="radio" id="sex" name="sex" value="male" /> Male<br />
<input type="radio" id="sex" name="sex" value="female" /> Female

    <input type="text" name="des" id="des" />
</form>

Javascript将是

$("#des").val($("#sex").val());
$("#sex").change(function(){
    alert($("#sex").val());     
   $("#des").val($("#sex").val());
});
Demo

http://jsfiddle.net/Wr8dJ/23/

带有onclick的Jquery单选按钮

3 个答案: