javascript - jQueryでデータ属性を使用するには?

Question

私のjQueryはvalue属性を選択します。データ属性「data-price」を選択するように jQuery を変更するにはどうすればよいですか?

HTML:

<span id="priceToSwap3"">$238</span>

<select id="trapsize">
 <option data-price="238">item1</option>
 <option data-price="288">item2</option>
</select>

<select id="trapfabric">
 <option data-price="0">item3</option>
 <option data-price="20">item4</option>
</select>

jQuery:

$('#trapfabric, #trapsize').on('change', function() {
  var $selected = $('#trapfabric, #trapsize').children(":selected");

  sum = parseInt($('#trapsize').val()) + parseInt($('#trapfabric').val());
  $('#priceToSwap3').html('$' + sum
    );
});

Answer 1

データ属性を取得するには$(el).data('price')

var sum = $('#trapsize option:selected').data('price') + $('#trapfabric option:selected').data('price');

デモ:フィドル

Answer 2

これを試して

 $('#trapsize option:selected').data('price'); 

あなたのコードを使用して

$('#trapfabric, #trapsize').on('change', function() {
  sum = parseInt($('#trapsize option:selected').data('price')) + parseInt($('#trapfabric option:selected').data('price'));
  $('#priceToSwap3').html('$' + sum); 
});

ここでフィドルの例

Answer 3

$('option').attr('data-price');

Answer 4

attr("data-price");

また

data("price");

後者が望ましい方法です。

---

コードでは次のようになります。

sum = parseInt($('#trapsize option:selected').data('price')) + parseInt($('#trapfabric option:selected').data('price'));

---

詳しくはdata() こちら。

Answer 5

試す：

 $('#trapsize option:selected').data('price');  

 $('#trapfabric option:selected').data('price');

そして、あなたの機能は次のようになります。

$('#trapfabric, #trapsize').on('change', function() {
   sum = parseInt($('#trapsize option:selected').data('price')) + parseInt($('#trapfabric option:selected').data('price'));
   $('#priceToSwap3').html('$' + sum);
})  

Answer 6

jquery属性を使用できます

$("your dom").attr("data-price")