如何使用JavaScript从单选按钮获取数据属性？

我想从选中的单选按钮中获取数据价格值。我试过这样的方法：

<input type="radio" name="vehicletype" id="vehicletype" value="{{$vehicletypeData->id}}" data-price="{{$vehicletypeData->km_rate}}" required="">


var vehicleTyp=document.getElementById("vehicletype");
                var vetselindx=vehicleTyp.options[vehicleTyp.selectedIndex];
                var prikm=vetselindx.getAttribute("data-price");

var vehicleTyp=document.getElementById（“vehicletype”）；
var vetselindx=车辆类型选项[vehicleTyp.selectedIndex]；
var prikm=vetselindx.getAttribute（“数据价格”）；

---

但这是行不通的。如何解决此问题？

您可以引用元素的自定义

数据-

属性，如下所示：

const el = document.getElementById("vehicletype");
const price = el.dataset.price;

有关详细信息，请参见关于使用数据属性的

注意：如果属性名称中有第二个破折号，例如

数据价格新建

则

数据集

对象属性将反映这种情况<代码>数据集。价格新建

这将获取具有该id的元素。具有该id的单个元素。文档中的多个元素不能共享一个id

选择具有选项的图元。单选按钮不起作用

---

要查找选中的元素，您应该：

• 获取所有单选按钮。考虑<代码> GETelEntsByNAME< /COD>
• 在它们上面循环，直到找到一个

  选中的
  属性为true

---

---

找到要查找的元素后，可以使用

getAttribute（“数据价格”）或。
是
{{$vehicletypeData->id}
Laravel？@RishiRaut-yah-SirTry-console.log（vehicleTyp.dataset.price）；您只显示了一个单选按钮，但我是否正确地认为您（错误地）在集合中的所有单选按钮上设置了相同的
id
属性，然后尝试使用
.options
-用于
元素-来获取所选的一个？@lakshay未捕获引用错误：
$
未定义。您也可以使用
文档.querySelector（“[name=vehicletype]：checked”）
直接获取所选单选按钮。如果没有选择任何一个，则返回
null
。虽然这是真的，但它不会解决问题中的问题。事实上，
elem.getAttribute（“数据价格”）
是问题中唯一一段实际工作正常的代码。
document.getElementById("vehicletype");

vehicleTyp.options