动态创建单选按钮？答案

【问题标题】：dynamically create radio buttons?动态创建单选按钮？
【发布时间】：2009-06-08 08:26:27
【问题描述】：

参考creating dynamic radio button w/ JQuery，我在想如果在页面加载时从数据库中检索输入值（“红色”或“蓝色”），如何处理。

以上述链接中的相同示例，如果红色、蓝色或其他动态值，我们如何动态构建单选按钮 - 红色 = 1 个单选按钮，蓝色 = 2 个单选按钮......等等？我是新来的。我目前正在使用 grails 来尝试一下。有没有 jquery-ish 的方式来做到这一点？我没有在 grails 中找到任何标签来实现这个！

编辑：有人向我指出radioGroup（grails标签），我打算拥有一个基于CSS的类（包含一个gif），包含需要显示的不同图像不同的价值观。 - 类似于从数据库中显示星级（不基于用户选择） - 红色/蓝色等。

<select id="aaa">
    <option>red</option>
    <option>blue</option>
    <option>other</option>
</select>

<div id="abc">
    Input<br>
    option 1 <input type="radio" name="colorinput" value="1" />
    option 2 <input type="radio" name="colorinput" value="2"  />
</div>
<br>
<div id="def">
    Description<br>
    option 1 <input type="radio" name="colordesc" value="1" />
    option 2 <input type="radio" name="colordesc" value="2" />
</div>
<br>

【问题讨论】：

标签： jquery html grails radio-button

【解决方案1】：

如果您真的想在页面加载时执行此操作（即不响应 AJAX 请求），那么您不需要 JQuery，您需要带有 values 和 labels 参数的 radioGroup grails 标记由您的数据库查询结果填充。

【讨论】：

@micahel borgwardt，我有一个基于 CSS 的类（包含 gif），其中包含需要根据不同值显示的不同图像。 - 类似于星级，但不完全是。
所以你想在选择不同的单选按钮时更改 CSS 类？在这种情况下，这个问题的措辞很糟糕，因为单选按钮的创建不需要是动态的，也不是真正的问题。
不，我的值在数据库“红色、蓝色等”中，根据这些值，我需要显示单选按钮（使用 jquery 插件星级评分）而不是星号，我是显示不同的图像。所以我需要像这样的 jquery 明星插件之类的东西你知道如何从 radioGroup 嵌入或调用 CSS 类吗？圣杯标签？感谢您的宝贵时间。
在这种情况下，我认为您所要做的就是向 g:radioGroup 标签添加一个类属性。
那么我猜你必须编写自己的单选按钮标签库。在 grails 中很容易做到这一点：grails.org/Dynamic+Tag+Libraries

【解决方案2】：

试试这个：

$(function(){ //$(document).ready(function(){ // same thing
    var colors=[];
    colors['red']=1;
    colors['blue']=2;
    colors['other']=3;
    $('#aaa').change(function(){
        var value = $(this).val();
        $('#abc, #def').find('input')
            .removeClass('red')
            .removeClass('blue')
            .removeClass('other');
        $('#abc, #def').find('input[value=' + colors[value] + ']).addCLass(value);
        });
    });

【讨论】：