从下拉菜单创建复选框

我试图寻找一个适合我的问题的工作解决方案，但经过几天的研究后，无法正常工作，这就是为什么我要求您的帮助。从下拉菜单创建复选框

基本上，我想要做的是有一个下拉菜单，其中有几个年份组选项。所以例如下拉菜单里面会有7年，8年9年等等。

一旦他们选择了第7年，系统将只创建一个复选框。对于第8和第9年，应该创建两个复选框，因为他们可以选择一个或两个主题。

如果下拉菜单没有改变，应该没有复选框。

我希望这些都有意义，你们将能够给我一个答案。在此先感谢。

来源

2017-02-12 leveeee

你想要做将有助于什么的可视化。你的问题的后半部分令人困惑。 – Darkrum

事情是这样的，那么：

var subjectMap = { 
 
    'Year 7' : ['Maths'], 
 
    'Year 8' : ['Maths', 'English'], 
 
    'Year 9' : ['Maths', 'English', 'French'], 
 
    'Year 10' : ['French', 'History', 'Geography'] 
 
} 
 

 
$(document).ready(function() { 
 
    for (var year in subjectMap) { 
 
    $('#yearGroup').append($('<option>', {value:year, text:year})); 
 
    } 
 
    
 
    $('#yearGroup').change(function() { 
 
    var selectedYear = $("#yearGroup option:selected").val(); 
 
    $("input:radio[name='subjects']").hide().attr('checked', false); 
 
    $("input:radio[name='subjects']").each(function(){ 
 
     $("#label"+ $(this).val()).hide(); 
 
    }); 
 
    for (var availableSubject in subjectMap[selectedYear]) { 
 
     $("#" + subjectMap[selectedYear][availableSubject]).show(); 
 
     $("#" + subjectMap[selectedYear][availableSubject]).each(function(){ 
 
     $("#label"+ $(this).val()).show(); 
 
     }); 
 
    } 
 
    }).change(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id='yearGroup'></select><br> 
 

 
<label for="Maths" id="labelMaths">Maths</label><input type="radio" name="subjects" value="Maths" id="Maths"> 
 
<label for="English" id="labelEnglish">English</label><input type="radio" name="subjects" value="English" id="English"> 
 
<label for="French" id="labelFrench">French</label><input type="radio" name="subjects" value="French" id="French"> 
 
<label for="History" id="labelHistory">History</label><input type="radio" name="subjects" value="History" id="History"> 
 
<label for="Geography" id="labelGeography">Geography</label><input type="radio" name="subjects" value="Geography" id="Geography">

来源

2017-02-12 17:35:38 Kit

非常感谢！ – leveeee

有很多Google的答案，一打jQuery plugins和SO答案已经问及解决它。为什么不接受你或你需要什么？

来源

2017-02-12 17:01:22 Daniel

我知道有大量的jQuery插件，但我特别想用javascript来做。 – leveeee

从下拉菜单创建复选框

回答

相关问题