我的 html 代码如下所示:
<select id="invoice_line_items_attributes_0_product_id" class="select required form-control" name="invoice[line_items_attributes][0][product_id]">
<option value=""></option>
<option value="34" data-price="123.0">asdsad</option>
<option value="35" data-price="123213.0">asd</option>
</select>
<select id="invoice_line_items_attributes_1_product_id" class="select required form-control" name="invoice[line_items_attributes][0][product_id]">
<option value=""></option>
<option value="31" data-price="1223.0">asdsad</option>
<option value="32" data-price="12333213.0">asd</option>
</select>
现在我想迭代所有这些选择,当其中一个更改时,该值会提醒该日期价格属性。我尝试使用以下代码来执行此操作:
$('[id*="product"]').each ->
$(this).change ->
alert $(this).attr("data-price")
但是它给了我 undefined 而不是这个数据价格值。
最佳答案
三件事:
1) 您不需要单独迭代 select 元素,然后绑定(bind)偶数。选择器将自行对匹配的元素执行此操作。
2)您需要找到所选选项,然后获取数据价格值。
3) 使用.data()
而不是使用.attr()
来获取数据属性值。
用途:
$('[id*="product"]').change(function(){
alert($(this).find('option:selected').data('price'));
});
<强> Working Demo
关于javascript - Jquery,从匹配正确模式的所有div中读取数据属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25401512/