如何获取一个对象的“值”属性<input> html中的元素？

Question

假设有一个<input>元素。 当我使用jQuery获取该元素的属性时，以下是我的代码：

 console.log($("#radio").attr("type")); console.log($("#radio").attr("value"));

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <input id="radio" type="radio" value="a" />

结果是：无线电未定义

为什么我不能获得“价值”属性？

Answer 1

为了发布示例而将我的评论转换为答案

$("#radio").val()是正常方式。

不要有两个具有相同 ID 的收音机。 ID 必须是唯一的

收音机必须具有相同的名称，因此单击一个将从另一个中删除选中的。

您可以通过$("[name=radio]:checked").val()获取选中的命名收音机的值

在这里，我故意留下重复的 ID，你会看到它只有在通过 ID 访问时才获得第一个的值

除非您在收音机存在之前调用脚本，否则在此设置中不可能未定义

如果脚本运行时 DOM 中的收音机不可用，您可能希望包装在加载事件处理程序中

 $(function() { // when page loads console.log($("#radio").val()) console.log($("#radio").attr("value")); console.log($("[name=radio]:checked").val()) $("[name=radio]").on("click", function() { console.log(this.value, $(this).val()); // either will work }) })

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <input id="radio" name="radio" type="radio" value="b" /> <input id="radio" name="radio" type="radio" value="a" checked/>