为什么返回 javascript 选择器的值，但使用 jquery 未定义

Question

我有一个名为myForm的简单表格，我正在做这个练习，以便在 Javascript 和 jquery 上做得更好。在我的表格中，我有一组单选按钮，它们充当 boolean 值来显示或隐藏其他内容（在本例中，2 div包含表格的 s）。

我想使用 jquery 选择器而不是整个document.get javascript 方式稍微整理一下代码。 如果重要的话，我正在 ASP.NET Core 3.1 MVC 应用程序中执行此操作。

以下代码正确获取了我的单选按钮的值

我的看法

<div class="form-group">
     <input type="radio" asp-for="AssignExtension" name="AssignExtension" value='true' onclick="assignExtensionSelect('true')" /> Yes
     <input type="radio" asp-for="AssignExtension" name="AssignExtension" value='false' onclick="assignExtensionSelect('false')" /> No
</div>

网站.js

    <script>
        function assignExtensionSelect(extRequired) {
            let formInput = document.getElementById("myForm");
            //let formInput = $("#myForm");
            console.log(formInput.AssignExtension.value);

        if (extRequired) {
            $('#ifassignextension').show();
            $('#ifnotassignextension').hide();
        }
        else {
            $('#ifassignextension').hide();
            $('#ifnotassignextension').show();
        }
    }
    </script>

注释行是无法正常工作的行。 当我有formInput = $("#myForm");时，为什么代码返回undefined 但是当我使用document.getElementById语法分配变量时，是否按预期工作？

注意：我已经将 jquery 包含在视图中，并且其他函数已经在使用它，所以这不是依赖性问题或 jquery 未加载。

Answer 1

您正在尝试对 jQuery 个对象使用 DOM 属性。 如果您使用的是 jQuery，则必须使用它的选择器和方法。

let formInput = $("#myForm");
console.log(formInput.find("[name=AssignExtension]:checked").val());