Javascript jQuery数据属性未获取值

jQuery数据属性不适用于最简单的演示

$( document ).ready(function() {

  $("#font_selection").change(function(){
    var fontImgName = $(this).data('font-img');
    //var fontImgName = $("#font_selection").data('font-img');

    //var fontImgName = $(this).attr('data-font-img')
    //var fontImgName = $("#font_selection").attr('data-font-img')

    alert(fontImgName);

  });

});

我一定错过了什么，我尝试了我能想到的所有组合，但都没有成功，请帮助

---

jsiddle演示在这里

您需要查看所选的选项元素：

var fontImgName = $(this).find('option:selected').data('font-img');

---

您需要查看所选选项元素：

var fontImgName = $(this).find('option:selected').data('font-img');

---

您正在尝试获取

select

的

数据

属性&您的选择没有

数据

属性

我想您需要所选项目的数据属性

使用波纹管

var fontImgName = $(this).find(':selected').data('font-img');

---

您正在尝试获取

选择

的

数据

属性&您的选择没有

数据

属性

我想您需要所选项目的数据属性

使用波纹管

var fontImgName = $(this).find(':selected').data('font-img');

---

这是因为您正在引用

select

元素本身

var fontImgName = $(this).find('option:selected').data('font-img');

---

这将找到所选的选项，然后访问该选项的数据属性。你要做的是，你选择的是数据的属性值。在HTML中，select根本没有数据属性。

这是因为您正在引用

select

元素本身

var fontImgName = $(this).find('option:selected').data('font-img');

这将找到所选的选项，然后访问该选项的数据属性。你要做的是，你选择的是数据的属性值。在HTML中，select根本没有数据属性