Question

我正在构建一个网络应用程序，您可以将电视节目标记为“想要观看”，“正在观看”，“完成观看”或“停止观看”。有一个下拉列表可供选择。如果选择“正在观看”，则还应显示另外两个下拉菜单，以便用户输入他们上次观看的季节和剧集。但是，我无法让jQuery正常工作

HTML

<select name="updateTvStatus" class="form-control" id="updateTvStatus">
    <option value="4" selected>Want to Watch</option>
    <option value="1">Currently Watching</option>
    <option value="2">Finished Watching</option>
    <option value="3">Stopped Watching</option>
</select>
<div id="last-watched" class="hidden">
    <select name="updateLastSeason" class="form-control" id="updateLastSeason">
        <option value="0">Select Season:</option>
        <option value="1">Season 1</option>
        <option value="2">...</option>
    </select>
    <select name="updateLastEpisode" class="form-control" id="updateLastEpisode">
        <option value="0">Select Episode:</option>
        <option value="1">Episode 1</option>
        <option value="2">...</option>
    </select>
</div> <!-- /last-watched -->

的jQuery

$(document).ready(function() {    
    $("#updateTvStatus").change(function() {
        var TVstatus = $("#updateTvStatus").val();
        var ishidden = $('#last-watched').hasClass("hidden");
        if (TVstatus == 1 && ishidden == TRUE) {
            $('#last-watched').removeClass("hidden");
        } elseif (TVstatus != 1 && ishidden == FALSE) {
            $('#last-watched').addClass("hidden");
        }
    });
});

Answer 1

else if（elseif） - 语法错误。
由于JS区分大小写，因此您必须将TRUE / FALSE更改为true / false。
您已指定了类选择器而不是ID选择器。请将$（＆＃39; .last-watched＆＃39;）更改为$（＆＃39;＃last-watched＆＃39;）。

（并且您可以使用===代替==进行严格比较）。因此，完成的代码ll看起来像这样：

    $(document).ready(function() {    
      $("#updateTvStatus").change(function() {
        var TVstatus = $("#updateTvStatus").val();
        var ishidden = $('#last-watched').hasClass("hidden");
        if (TVstatus == 1 && ishidden == true) {
           $('#last-watched').removeClass("hidden");
        } else if (TVstatus != 1 && ishidden == false) {
           $('#last-watched').addClass("hidden");
       }
      });
    });

Answer 2

我不知道你在找什么。但这就是你想要的：

$(document).ready(function() {    
$('#last-watched').hide();
$("#updateTvStatus").change(function() {
 var TVstatus = $("#updateTvStatus").val();
   if(TVstatus == 1){
        $('#last-watched').show();
    }else {
        $('#last-watched').hide();
    }
});
});
</script>

Jquery选择下拉列表以添加或删除类

2 个答案: