Question

我有一个工作代码，我使用value =＆＃34;＆＃34;输出价格。但我需要一种从data-price =＆＃34;＆＃34;获取数据的方法。所以我可以使用value =＆＃34;＆＃34;存储SKU。在这里工作演示http://jsfiddle.net/pe2gpp01/21/

这段代码有什么作用？它为所有产品返回女性的固定价格。仅限男性的价格变动。

<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>

Answer 1

此代码说如果您选中了女性元素值，然后将价格设置为10，否则价格是指定类别中的值。

 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函数的用户正确添加。

Answer 2

您必须使用data方法获取data-price属性

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

使用jquery从data-price获取数据

2 个答案: