Question

我有一些表格选择，有一些选项。选项具有属性“数据图像”。当我尝试捕获.change的数据值时，返回发送给我“未定义”。

HTML

<select id="onde">
  <option value="1000" data-image="SP">Sampa</option>
  <option value="2000" data-image="RJ">Rio</option>
</select>

的jQuery

$("#onde").change(function(){
    var value = $(this).data("image");
    alert(value);
});

警报返回“未定义”。当我为.data()更改.val()时，返回选项的值（1000或2000），以及为什么不返回带数据的数据图像？

Answer 1

您需要找到所选的选项

var value = $(this).find('option:selected').data("image");

在更改处理程序this中引用的select元素没有data-image属性，因此您需要先找到所选的（使用:selected selector）选项那么它的数据值

Answer 2

工作正常..

JS：

$("#onde").change(function(){
    var value = $(this[this.selectedIndex]).data("image");
    alert(value);
});

Answer 3

或者你可以这样做：

$('select').on('change', function(){

  var value = $('#onde :selected').data("image");

    alert(value);    
});