获取 td 中的数据属性值答案

【问题标题】：Getting data attribute value in td获取 td 中的数据属性值
【发布时间】：2016-10-23 23:05:05
【问题描述】：

我在 td 中添加了类似这样的数据属性：

   <td style="text-align:center;padding: 3px 0;data-id:2;data-env:PL1;"><img  src="/VendorFeedDevUI/Content/green.png" style="width:25px" alt="Green"><div>21 Dec 14<br>23:55:00</div></td>

当我想在 Jquery 中检索相同的属性时，我使用以下代码：

  $(".gradienttable tr td").click(function () {
        showRefreshControl();
        var id = $(this).attr('data-id');
        var env = $(this).data('env')
       });

我正在尝试使用这两种方法来获取数据属性，但两者都返回未定义。我也得到了$(this) 的 td 对象，所以这不是问题。那我做错了什么？

【问题讨论】：

这不是你的 HTML 中的 data 属性，它是一个不存在的 CSS 属性。
有'data-id'和'data-env'
@user3013365 不，它们是你写的 CSS 属性，顺便说一句，无效的

标签： javascript jquery html html-table

【解决方案1】：

你用错了：

 <td style="text-align:center;padding: 3px 0;" data-id="2" data-env="PL1">...</td>

将数据属性添加到样式中，必须将其放在样式属性之外。

【讨论】：

【解决方案2】：

   <td style="text-align:center;padding: 3px 0;" data-id="2" data-env="PL1"><!-- ... --></td>

这就是你设置属性的方式，而不是你的风格。

然后您可以像在此处所做的那样拿起它：

  $(".gradienttable tr td").click(function () {
        showRefreshControl();
        var id = $(this).attr('data-id');

【讨论】：

【解决方案3】：

这不是 HTML 中的 data 属性，它是一个不存在的 CSS 属性。更改您的 HTML 以实际使用正确的属性，然后您的代码应该可以工作：

<td style="text-align: center; padding: 3px 0;" data-id="2" data-env="PL1">
   <img src="/VendorFeedDevUI/Content/green.png" style="width:25px" alt="Green" />
   <div>21 Dec 14<br>23:55:00</div>
</td>

【讨论】：

【解决方案4】：

<td style="text-align:center;padding: 3px 0;" data-id = "2" data-env = "PL1">

【讨论】：