创建带有JQuery的动态单选按钮 [英] creating dynamic radio button w/ JQuery

问题描述

我有一个项目，我需要根据用户在下拉菜单中选择的给定值，为用户提供几组不同的单选按钮选项.

I have a project where I need to give the users several different sets of radio button options based on a given value they select in a drop down menu.

例如.

<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>

我只是想在每次选择不同选项时从一个(或两个)单选列表中添加/删除选项.

I would simply like to add/remove options from either(or both) lists of radio options each time they make a different selection.

推荐答案

您可以执行以下操作:

$(document).ready(function() {
    // add a new input when a new color is chosen, for example
    $('#aaa').change(function() {
        var radio = $('<input>').attr({
            type: 'radio', name: 'colorinput', value: '3'
        });
        $(':radio:last-child', '#abc').after(radio).after('option 3 ');
    });
});

它是动态创建新输入并将其插入最后一个广播在#abc元素内.

It is dynamically creating a new input and inserting it after the last radio inside the #abc element.

这篇关于创建带有JQuery的动态单选按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！