所以我只有一个文本字段 BODY 填充了预内容 First Value
<%= f.input :body, :input_html => { :value => "First Value" } %>
现在我想为用户提供从多个文本区域复选框中选择一个文本区域的选项,我该怎么做?请参阅图片http://i.imgur.com/Xy4LVko.png以获得更好的说明
我假设会涉及到一些 jQuery
谢谢
所以我只有一个文本字段 BODY 填充了预内容 First Value
<%= f.input :body, :input_html => { :value => "First Value" } %>
现在我想为用户提供从多个文本区域复选框中选择一个文本区域的选项,我该怎么做?请参阅图片http://i.imgur.com/Xy4LVko.png以获得更好的说明
我假设会涉及到一些 jQuery
谢谢
是的,你是对的,你将不得不使用一些 jquery。考虑您的复选框 id 是“checkbox_1”,而 textarea id 是“textarea_1”,那么您可以按如下方式进行:
$(document).ready(function(e){
$("#checkbox_1").click(function(e) {
$("#textarea_1").focus();
});
});
如果需要,您还可以检查复选框的值。
我们可以像这样对复选框和相应的输入进行分组
<% form_for @object do |f| %>
<div class="optional-input">
<%= check_box_tag :attribute1 %>
<%= f.text_area :attribute, :class => "display: none;" %>
</div>
<div class"optional-input">
<%= check_box_tag :attribute2 %>
<%= f.text_area :attribute2, :class => "display: none;" %>
</div>
................
................
现在,如果我们有复选框元素,我们可以访问相应的文本区域,因为它们是同级的。然后我们可以将 on-change 事件处理程序绑定到每个复选框,它是 div 元素的子元素。
$(document).ready(function(){
$('.optional-input').find(':checkbox').change(function(){
if($(this).is('checked')){
$(this).siblings('textarea').show()
}
else{
$(this).siblings('textarea').hide()
}
})
})
我希望它会工作