漏洞？？？ 将数据从 model 加载到 js

Question

我制作了一个 JS function，它为酒店房间的客户创建选择器标签。 因此，如果我的房间容量等于 4，它会动态创建 4 个选择器。 在我的选择器标签中有包含客户端的选项。 选项值是客户端的 ID，但是当我将 options.text 设置为客户端名称时，例如出现错误：

未捕获的 ReferenceError：在 HTMLSelectElement.onchange 中未定义 changeFunc 这是我的 function：

<script type="text/javascript">
function changeFunc() {
    var elements = document.getElementsByClassName('selector2');
    while (elements.length > 0) {
        elements[0].parentNode.removeChild(elements[0]);
    }
    var selector = document.getElementById('selector');
    var selectedValue = selector.value;
    console.log(selectedValue);
    @foreach (var item in Model.Rooms)
    {
            <text>
            if (@item.RoomID == selectedValue)
            {
                var selectedValue2 = @item.Capacity;
            }
            </text>
    }
    var inputContainer = document.getElementById('for-input');
    for (var i = 0; i < selectedValue2; i++)
    {
        var selector2 = inputContainer.appendChild(document.createElement("select"));
        selector2.className = "selector2";
        @foreach (var item in Model.Clients)
        {
            <text>
                var optionz = document.createElement("option");
                optionz.value = @item.ID;
                optionz.text = @item.Name; <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<
                selector2.appendChild(optionz);
            </text>

        }
    }
}

这是包含所有选择器的我的 div：

 <div id="for-input"></div>

奇怪的是，如果我将 item.Name 更改为 item.ID 或 item.phoneNumber，它会起作用。 这意味着它仅出于某种原因支持整数。 然后我尝试将 optionz.text 设置为“Hello world”，它也起作用了：！！ 这让我大吃一惊：X

我认为 model 存在一些问题，并尝试将客户端加载到不同的选择器中：

 <select> @foreach (var item in Model.Clients) { <option value="@item.Name">@item.Name</option> } </select>

它也有效！

问题出在哪里？？？

请不要过多评价我，这是我在 JS 中的第一个代码：我正在学习它 rn :)

提前致谢！

更新：这是我的 onchange 处理程序：

 <div class="form-group"> <label asp-for="Reservations2.RoomId" class="control-label"></label> <select asp-for="Reservations2.RoomId" onchange="changeFunc();" class="form-select" id="selector"> @foreach (var item in Model.Rooms) { <option value="@item.RoomID">Room @item.RoomID with capacity of@item.Capacity</option> } </select> <span asp-validation-for="Reservations2.RoomId" class="text-danger"></span> </div>

Answer 1

解决方案非常简单。 我只需要将值放在引号中...