JS：单选按钮 - 根据选择动态生成

Question

我不知道如何描述，希望你明白我想说的：

假设：您最喜欢的两个汽车品牌是什么：

我选择了#1： 奥迪、大众、BWM、捷豹（是BWM）

对于#2，没有宝马的选项应该是一样的： 奥迪、大众、捷豹

如何从第二个选项字段中扣除选项 #1？

如有任何提示，我们将不胜感激！

（我通常写PHP，但我喜欢在不刷新屏幕的情况下实现它，我知道 JS 可能可以做到这一点，但我缺乏那种技能）

Answer 1

此示例使用 jQuery 库，其工作方式如下：

如果您从字段集 1 中选择某些内容，它只会隐藏来自另一个字段集的类似输入。

它还隐藏了位于输入标签附近的标签。

您可以运行这个片段来了解它是如何工作的。

$("input[name=cars_0]").change(function(){

  
  var val = $(this).val();
  

 // Show everything before hiding new one
  $("input[name=cars_1]").show()
   .prev('label').show();
  
  // Hide input tag based on value
   $("input[name=cars_1][value="+val+"]").hide()
   .prev('label').hide(); //Hide label tag
  
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>

  <fieldset>
    <label for="audi_0">Audi</label>
    <input id="audi_0" type="radio" name="cars_0" value="audi">

    <label for="bmw_0">BMW</label>
    <input id="bmw_0" type="radio" name="cars_0" value="bmw">
    
    <label for="jaguar_0">Jaguar</label>
    <input id="jaguar_0" type="radio" name="cars_0" value="jaguar">
    
  </fieldset>
  
  <fieldset>
    <label for="audi_1">Audi</label>
    <input id="audi_1" type="radio" name="cars_1" value="audi">

    <label for="bmw_1">BMW</label>
    <input id="bmw_1" type="radio" name="cars_1" value="bmw">
    
    <label for="jaguar_1">Jaguar</label>
    <input id="jaguar_1" type="radio" name="cars_1" value="jaguar">
    
  </fieldset>
  
</form>

JS：单选按钮 - 根据选择动态生成

JS: Radio buttons - dynamically generated based on selection

javascript

forms

options