JQuery 代码未定义。功能未触发

Question

我收到以下错误：

未捕获的引用错误：toggleOptionsVisibility 未定义 在 HTMLSelectElement.onchange

我的 HTML：

    <div>
    <label asp-for="Type"></label>
    <select id="field-type" asp-for="Type" asp-items="Html.GetEnumSelectList<HourglassCopyEditor.Models.FieldType>()" onchange="javascript:toggleOptionsVisibility();"></select>
</div>

<div id="options-section" style="display: none;">
    <h3>Options</h3>
    <div id="options-container">
        @for (int i = 0; i < Model.Options.Count; i++)
        {
            <div class="option-item">
                <input type="hidden" asp-for="@Model.Options[i].Id" />
                <input type="hidden" asp-for="@Model.Options[i].FormFieldId" />
                <label asp-for="@Model.Options[i].Value">Option @(i + 1)</label>
                <input asp-for="@Model.Options[i].Value" />
                <button type="button" class="remove-option" data-option-id="@Model.Options[i].Id">Remove</button>
            </div>
        }
        <button type="button" id="add-option">Add Option</button>
    </div>
</div>

我的Javascript/Jquery：

function toggleOptionsVisibility() {
    var selectedType = $('#field-type option:selected").text();
    if (selectedType == 2 || selectedType == 2 || selectedType == 3) {
        alert("show");
        $('#options-section').show();
    } else {
        alert("hide");
        $('#options-section').hide();
    }
}

我不明白为什么我的函数没有被调用。任何建议将不胜感激。

Answer 1

您的脚本似乎有错误。尝试更换

var selectedType = $('#field-type option:selected").text();

由

var selectedType = $('#field-type option:selected').text();