ASP.NET 5 MVC使用jQuery显示和隐藏div元素

我试图在我的mvc应用程序中隐藏一些html表单。我正在使用jQuery尝试隐藏我的元素

这是我的剃须刀页面

<div id="Types" class="form-group">
            <label asp-for="Type" class="control-label"></label>
            <select asp-for="Type" class="form-control">
                <option>Select a Type</option>
                <option value="Book">Book</option>
                <option value="AudioBook">AudioBook</option>
                <option value="ReferenceBook">Reference Book</option>
                <option value="DVD">DVD</option>
            </select>
            <span asp-validation-for="Type" class="text-danger"></span>
        </div><div id="ThePages" class="form-group">
            <label asp-for="Pages" class="control-label"></label>
            <input asp-for="Pages" class="form-control" />
            <span asp-validation-for="Pages" class="text-danger"></span>
        </div>
        <div id="TheRunTime" class="form-group">
            <label asp-for="RunTimeMinutes" class="control-label"></label>
            <input asp-for="RunTimeMinutes" class="form-control">
            <span asp-validation-for="RunTimeMinutes" class="text-danger"></span>
        </div>
        <div id="Borrowable" class="form-group form-check">
            <label class="form-check-label">
                <input class="form-check-input" asp-for="IsBorrowable" /> @Html.DisplayNameFor(model => model.IsBorrowable)
            </label>
        </div>
        <div id="BorrowedBy" class="form-group">
            <label asp-for="Borrower" class="control-label"></label>
            <input asp-for="Borrower" class="form-control" />
            <span asp-validation-for="Borrower" class="text-danger"></span>
        </div>
        <div id="TheDate" class="form-group">
            <label asp-for="Date" class="control-label"></label>
            <input asp-for="Date" class="form-control" />
            <span asp-validation-for="Date" class="text-danger"></span>
        </div>

在第一个函数loadOnDisplay（）中，默认情况下，我删除了所有不想显示的元素。 这里的想法是，当用户选择例如“Book”时，只有与Book相关的元素对用户可见。例如DVD也是如此

第一个函数起作用，但当我试图选择一本书或dvd时，它会显示一些元素，但不是全部。当我试图改变我的选择时，什么也没有发生

这里缺少什么？

类型

元素是一个
，因此这不起作用：

$("#Types").change(function () {
    var value = $(this).val();
    //...
});

当
事件冒泡时，它可能确实捕捉到了
更改
事件，但
本身没有“值”。不要使用
，而是使用
：

#Types
元素是一个
，因此这不起作用：

$("#Types").change(function () {
    var value = $(this).val();
    //...
});

当
事件冒泡时，它可能确实捕捉到了
更改
事件，但
本身没有“值”。不要使用
，而是使用
：

打字错误您正在使用
=
在一个条件中进行比较，而不是使用
=
。因此，该条件将始终为真。嘿，感谢您的输入！我更改了此选项，但现在在选择option.Typo时什么也没有发生。您正在使用
=
在一个条件中进行比较，而不是使用
=
。因此，该条件将始终为真。嘿，感谢您的输入！我改变了这一点，但现在在选择一个选项时什么也没有发生。这成功了，谢谢你的输入！这就成功了，谢谢你的投入！
$("#Types select").change(function () {
    var value = $(this).val();
    //...
});