我有一个包含多个选项的下拉列表,每个选项都有一个名称属性。当我选择一个选项时,需要出现不同的复选框列表 - 当选择另一个选项时,该复选框列表应该消失并显示另一个复选框。
我创建了这些复选框列表,并为它们提供了一个与所选选项的名称属性相关的 ID。我正在尝试使用以下代码来显示正确的复选框列表
$(document).ready(function(){
$('#band_type_choices').on('change', function() {
$('.checkboxlist').hide();
$('#checkboxlist_' + $(this).attr("name") ).css("display", "block");
});
然而什么也没有发生。
这是我的下拉选项:
<select id="band_type_choices">
<option vlaue="0"></option>
<option value="100" name="acoustic">Acoustic</option>
<option value="0" name="jazz">Jazz/Easy Listening</option>
<option value="0" name="acoustic_jazz">Acoustic + Jazz/Easy Listening</option>
<option value="0" name="party">Party</option>
<option value="0" name="acoustic_party">Acoustic + Party</option>
<option value="0" name="jazz_party">Jazz/Easy Listening + Party</option>
<option value="0" name="acoustic_jazz_party">Acoustic + Jazz/Easy Listening + Party</option>
</select>
以及其中一个列表的示例:
<div class="checkboxlist" id="checkboxlist_acoustic" style="display:none;">
<input type="checkbox" class="checkbox keys" name="keys" value="100" />Keys<br>
<input type="checkbox" class="checkbox acou_guit" name="acou_guit" value="100" />Acoustic Guitar<br>
<input type="checkbox" class="checkbox drums" name="drums" value="100" />Drums<br>
<input type="checkbox" class="checkbox alt_sax" name="alt_sax" value="100" />Alto Sax<br>
<input type="checkbox" class="checkbox ten_sax" name="ten_sax" value="100" />Tenor Sax<br>
<input type="checkbox" class="checkbox clarinet" name="clarinet" value="100" />Clarinet<br>
<input type="checkbox" class="checkbox trombone" name="trombone" value="100" />Trombone<br>
<input type="checkbox" class="checkbox trumpet" name="trumpet" value="100" />Trumpet<br>
<input type="checkbox" class="checkbox flute" name="flute" value="100" />Flute<br>
<input type="checkbox" class="checkbox cello" name="cello" value="100" />Cello<br>
<input type="checkbox" class="checkbox violin" name="violin" value="100" />Violin<br>
</div>
对于像我这样这么晚才遇到的人。
正如其他人所说,name不是一个有效的属性option元素。将上面接受的答案与从另一个问题中回答 https://stackoverflow.com/questions/3742378/find-name-of-selected-option-using-jquery, 你得到:
$(this).find('option:selected').text();
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)