jquery可以'；无法获取数据属性值

我试图在jQuery中设置一个变量。该值应在按钮的单击事件上设置。onclick事件触发，但x10Device变量保持未定义

我在jQuery1.7.1上

jQuery：

 $x10Device = $(this).data("X10");

HTML:

我看不出有什么不对。

jQuery的

data（）

方法将允许您访问

data-*

属性，但它会破坏属性名称的大小写。您可以使用以下选项之一：

$('#myButton').data("x10") // note the lower case

或者，您可以使用

attr（）

方法保留您的案例：

$('#myButton').attr("data-X10")

在此处尝试两种方法：

请注意，这些方法并不完全相同。如果要更改元素的

数据-*

属性，则应使用

attr（）

data（）

最初会读取一次值，然后继续返回缓存副本，而

attr（）

每次都会重新读取属性

请注意，jQuery还将属性名称中的连字符转换为驼峰大小写（--e.e.

data some data==$（ele.data（'someData'）

）。这两种转换都符合HTML规范，该规范规定自定义数据属性不应包含大写字母，并且连字符将在

数据集

属性（）中以驼峰式大小写。jQuery的

数据

方法仅仅是模仿/符合这个标准行为

文档

• 数据

  -

• attr

  -
• HTML语义和结构，自定义数据属性-

---

使用普通javascript方法

$x10Device = this.dataset("x10");

伊亚普。它的工作 数据名称区分大小写 data-x10

---

var变量=$（'#myButton'）。数据（“x10”）//我们得到自定义数据属性的值
将大小写更改为所有小写对我来说都有效
 您可以根据需要更改选择器和数据属性

 <select id="selectVehicle">
       <option value="1" data-year="2011">Mazda</option>
       <option value="2" data-year="2015">Honda</option>
       <option value="3" data-year="2008">Mercedes</option>
       <option value="4" data-year="2005">Toyota</option>
  </select>

$("#selectVehicle").change(function () {
     alert($(this).find(':selected').data("year"));
});


马自达
本田
梅赛德斯
丰田
$（“#选择车辆”）。更改（功能（）{
警报（$（this）.find（'：selected'）.data（“年”）；
});

以下是工作示例：
请确保检查与按钮单击相关的事件是否未作为图标标记传播到子元素（
jQuery的哪个版本？信息不足。请共享更多代码。jQuery可能会将属性名称转换为所有小写，请尝试：
$（this）。数据（“x10”）；
为什么答案以不清楚的形式结束？我投票重新开始了这个问题。问题的内容非常清楚，问题收到的流量表明这是一个相当普遍的问题。当使用类似$（this）的驼峰大小写时，关于数据属性的大小写敏感度，+1还有.data（），这是一个很好的信息（“givememybananananas”）它将检索数据的html数据给我香蕉=“否！”补充说明，@BabyAzerty，以及它的部分原因（html规范规定自定义属性不包含大写字母）将所有内容都简化为小写，并像一个符咒一样工作！！thanks@JasonMillington很高兴能帮上忙！查看我写的关于
attr（）的便条
vs.
data（）
——您可能对
attr（）
更感兴趣，这取决于您将如何使用属性。
 <select id="selectVehicle">
       <option value="1" data-year="2011">Mazda</option>
       <option value="2" data-year="2015">Honda</option>
       <option value="3" data-year="2008">Mercedes</option>
       <option value="4" data-year="2005">Toyota</option>
  </select>

$("#selectVehicle").change(function () {
     alert($(this).find(':selected').data("year"));
});

<button data-x10="C5">
    <i class="fa fa-check"></i> Text
</button>

$('button.toggleStatus').on('click', function (event) {
    event.preventDefault();
    event.stopPropagation();
    $(event.currentTarget).attr('data-X10');
});