javascript - jQuery:使 hide() 和 show() 正常工作时遇到问题

Question

我是 jquery 新手，正在练习它。我创建了两个表格，显示军事北约字母表和拼音字母表的发音。在下拉框中选择“Alfabet”或“Cijfers”后，必须显示相应的表格。这不起作用，我不知道我做错了什么。我希望有人能帮我找出问题所在。

这是一个 jsFiddle:http://jsfiddle.net/qGUHy/1/

$(document).ready(function() {
$(".cijfers").hide();
});

$('#dropdown').change(function () {
    if ($('#dropdown option:selected').text() == "Alfabet"){
        $('.cijfers').hide();
        $('.alfabet').show();
    } else if ($('#dropdown option:selected').text() == "Cijfers"){
        $('.alfabet').hide();
        $('.cijfers').show();
    } else {
        $('.cijfers').hide();
    } });

Answer 1

您没有绑定(bind)到您的选择，因为您的 "#dropdown" 选择器通过 id 查找元素，但您为元素指定了名称。您可以按名称进行选择(使用“[name=dropdown]”)，但最好是使用 ID。

改变

    <select name="dropdown">

至

    <select id="dropdown">

Fixed fiddle