Javascript 基于第一个下拉列表更改第二个下拉列表
我想根据第一个下拉列表的选择更改第二个下拉列表,但它现在不起作用。我正在使用bootstrap select的selectpicker和form group类,尽管我不确定这是否导致了问题 在选择第一个下拉列表之前,将禁用第二个下拉列表,并且仅显示与数据组选择匹配的项目 HTML:Javascript 基于第一个下拉列表更改第二个下拉列表,javascript,jquery,html,twitter-bootstrap,Javascript,Jquery,Html,Twitter Bootstrap,我想根据第一个下拉列表的选择更改第二个下拉列表,但它现在不起作用。我正在使用bootstrap select的selectpicker和form group类,尽管我不确定这是否导致了问题 在选择第一个下拉列表之前,将禁用第二个下拉列表,并且仅显示与数据组选择匹配的项目 HTML: 如果我理解正确,我想这就是你需要的 使用$(“#俱乐部”).children().removeAttr('disabled')启用所有子项,然后禁用与此$(selectSeason).attr('disabled',
如果我理解正确,我想这就是你需要的 使用
$(“#俱乐部”).children().removeAttr('disabled')
启用所有子项,然后禁用与此$(selectSeason).attr('disabled','disabled')无关的子项代码>
请检查一下这把小提琴
如果我理解正确,我想这就是你需要的
使用$(“#俱乐部”).children().removeAttr('disabled')
启用所有子项,然后禁用与此$(selectSeason).attr('disabled','disabled')无关的子项代码>
请检查一下这把小提琴
那么您只想选择包含数据组的项目?请将#选项容器
值也包括在您的问题中我认为:应该是这样,您只想选择带有数据组的项目?请将#选项容器
值也包括在您的问题中我认为:应该是谢谢@穆罕默德·谢维尔。在没有类的情况下工作,但仍然不能与类一起工作。我想可能会有一些冲突。我不太明白你所说的在没有类的情况下可以工作,但仍然不能与类一起工作我的意思是我必须删除“class=”selectpicker form group“”,使其工作,但它不需要对该类进行任何更改。请检查小提琴更新此问题有助于解决我的问题:谢谢@穆罕默德·谢维尔。在没有类的情况下工作,但仍然不能与类一起工作。我想可能会有一些冲突。我不太明白你所说的在没有类的情况下可以工作,但仍然不能与类一起工作我的意思是我必须删除“class=”selectpicker form group“”,使其工作,但它不需要对该类进行任何更改。请检查小提琴更新此问题有助于解决我的问题:
<select id="seasons" class="selectpicker form-group" title="Choose season" onchange="filterSeason();">
<option value='2013-14'>2013-14</option>
<option value='2014-15'>2014-15</option>
<option value='2015-16'>2015-16</option>
<option value='2016-17'>2016-17</option>
</select>
<select id="clubs" class="selectpicker form-group" title="Choose club" disabled>
<optgroup data-group='2013-14' label="England">
<option data-group='2013-14' value='ENG1'>Team 1</option>
<option data-group='2013-14' value='ENG2'>Team 2</option>
</optgroup>
<optgroup data-group='2014-15' label="Spain">
<option data-group='2014-15' value='SPA1'>Team 3</option>
</optgroup>
<optgroup data-group='2015-15' label="Germany">
<option data-group='2015-16' value='GER1'>Team 4</option>
<option data-group='2015-16' value='GER2'>Team 5</option>
<option data-group='2015-16' value='GER3'>Team 6</option>
</optgroup>
</select>
function filterSeason() {
var seasons = $("#seasons").find('option:selected').text();
$("#option-container").children().appendTo("#clubs");
var selectSeason = $("#clubs").children("[data-group!='"+seasons+"']");
selectSeason.appendTo("#option-container");
$("#clubs").removeAttr("disabled");
};