Javascript 使用jquery从数据价格中获取数据

我有一个工作代码，其中我使用value=输出价格，但我需要一种从data price=获取数据的方法，以便我可以使用value=存储SKU。 工作演示在这里

这个代码是做什么的？它返回所有产品的固定价格。价格变化仅适用于男性

<div>
<label class="product">Product</label>
<span>
<input name="category" type="radio" value="10" >
<label>Product A</label>
<input name="category" type="radio" value="20" checked>
<label>Product B</label>
<input name="category" type="radio" value="30">
<label>Product C</label>
<input name="category" type="radio" value="40" >
<label>Product D</label>
</span></div>

<div>
<label class="gender">Gender</label>
<span>
<input name="gender" type="radio" value="male" checked>
<label>Male</label>
<input name="gender" type="radio" value="female">
<label>Female</label>
</span></div>

<span>Show Price: <span id="price"></span></span>


<script>
$(function() {
$('[type="radio"]').on('change', function() {

    var price = $('[value="female"]')[0].checked
      ? 10 
      : $('[name="category"]:checked').val();
   $('#price').text(price);
}).change();
});

</script>

我需要这方面的数据

<input name="category" type="radio" value="SKU001" data-price="10">
<label>Product A</label>
<input name="category" type="radio" value="SKU002" data-price="20" checked>
<label>Product B</label>
<input name="category" type="radio" value="SKU003" data-price="30">
<label>Product C</label>
<input name="category" type="radio" value="SKU004" data-price="40">
<label>Product D</label>

这段代码的意思是，如果选中了一个值，则将price设置为10，否则price是命名类别中的值

 var price = $('[value="female"]')[0].checked
      ? 10 
      : $('[name="category"]:checked').val();

。。。所以，这个

    var price = $('[value="female"]')[0].checked
      ? 10 + parseInt($('[name="category"]:checked').val(),10)
      : $('[name="category"]:checked').val();

。。。将在类别值中添加10。请注意parseInt函数的用户以进行适当的添加。

您必须使用方法获取数据价格属性

$('[name="category"]:checked').data('price')

---

你没有在HTML代码中使用数据价格。我更新了帖子。不管怎样，我得到了答案。感谢您的关注。我认为这比其他人使用的parseInt解决方案更有意义，因为parseInt会产生舍入错误。