显示在不同的单选按钮选择不同的选择菜单

我有五个单选按钮如下：显示在不同的单选按钮选择不同的选择菜单

<input type="radio" id="Gold" name="PackageID" value="77"/> 
<input type="radio" id="Silver" name="PackageID" value="73"/> 
<input type="radio" id="Bronze" name="PackageID" value="72"/> 
<input type="radio" id="Copper" name="PackageID" value="94"/> 
<input type="radio" id="Tester" name="PackageID" value="71"/>

和以下两个选择menues：

<select name="DripFeed" id="select3-basic" tabindex="1" data-placeholder="Days.." class="span1"> 
<option value="1">1</option> 
<option value="2">2</option> 
</select> 

<select name="DripFeed1" id="select3-basic" tabindex="1" data-placeholder="Days.." class="span2"> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="2">3</option> 
<option value="2">4</option> 
<option value="2">5</option> 
<option value="2">6</option> 
</select>

现在我需要的是，一旦用户选择单选带ID的按钮：Gold, Silver, Bronze, Copper显示名称为DripFeed的选择菜单，并且一旦用户选择带ID测试仪的单选按钮以显示名称为DripFeed1的选择菜单。

感谢您的帮助。

来源

2013-06-27 DigitalWhirl LLC

正如你无法取消该组中的无线电和只有一个无线电可以进行检查，任何改变通常会检查它，如果检查收音机的ID匹配Tester，显示DripFeed1和隐藏DripFeesd，否则反其道而行之：

$('[name="PackageID"]').on('change', function() { 
    var state = this.id == 'Tester'; 

    $('[name="DripFeed1"]').toggle(state); 
    $('[name="DripFeed"]').toggle(!state); 
});

注意，ID是独一无二的，你使用select3-basic多次（和相同的tabIndex）。

FIDDLE

来源

2013-06-27 18:20:10 adeneo

令人敬畏的作品就像我需要的一样。还有一件事，如果没有选择上述单选按钮，是否可以显示DripFeed1？ –

当然，由于您无法取消选中收音机，您可以将其设置为在网页加载时可见。如果你的收音机比问题中的收音机多，并且你真正想要做的是与上面的代码相反的内容，在四个ID中筛选出来，你会改变这种情况，像这样 - > http：/ /jsfiddle.net/5YE7j/2/ -------- – adeneo

太棒了，非常感谢您的帮助！都像魅力一样工作 –

显示在不同的单选按钮选择不同的选择菜单

回答

相关问题