如何使用jquery找到value = something的select标签的get属性？

Question

如何在＃products.option value = 6的情况下获取价格属性的值。

<select id="products">
<option value="2" price="60.00">Product 1</option>
<option value="4" price="40.00">Product 2</option>
<option value="6" price="40.00">Product 2</option>
<option value="8" price="40.00">Product 2</option>
</select>

Answer 1

您可以按其属性和值选择元素。

alert($('#products option[value="6"]').attr('price'));

演示：http://jsfiddle.net/tusharj/rhf0q9nt/

文档：https://api.jquery.com/attribute-equals-selector/

修改

感谢@satpal：

使用data-*前缀自定义属性在元素上存储任意数据。

<强> HTML

<select id="products">
    <option value="2" data-price="60.00">Product 1</option>
    <option value="4" data-price="40.00">Product 2</option>
    <option value="6" data-price="40.00">Product 2</option>
    <option value="8" data-price="40.00">Product 2</option>
</select>

<强>的Javascript

$('#products option[value="6"]').data('price');

演示：http://jsfiddle.net/tusharj/7c7aet9w/

Answer 2

你可以

1）使用 attribute equals selector 获取值等于6的选项：

2）使用.attr('price')获取上述选项的值

var price = $('option[value=6]').attr('price');

<强> Working Demo

Answer 3

使用attr()功能：

var price = $('#products option[value=6]').attr('price');

Answer 4

你可以用

获得它

var price = $('#products option[value="6"]').attr('price');