首页 > 解决方案 > 从 data-* 属性获取计数不起作用,为什么?

问题描述

data-count每次单击给定值时,我都会尝试获取该属性th,以下是我的操作方式。由于某种原因,价值data_id总是undefined,我无法找到原因。一定是非常愚蠢的事情。

我在这里缺少什么?

$(".s_header").click(function() {
    var column_id = $(this).attr('id');
    var data_id = $('#' + column_id).data('count');

    console.log(column_id);
    console.log(data_id);

    if (data_id % 2 == 0) {
        console.log("Even");
    } else {
        console.log("odd");
    }

    $('#' + column_id).data('count', data_id + 1);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>

<table class="s_grid" width="100%">
    <tr class="header hover" style="">
        <th id="col_1" data-count="0" class="s_header">Col 1</th>
        <th id="col_2" data-count="0" class="s_header">Col 2</th>
        <th id="col_3" data-count="0" class="s_header">Col 3</th>
    </tr>
</table>

标签: javascriptjquery

解决方案


问题是您的 jQuery 版本。来自jQuery 文档

从 jQuery 1.4.3 开始,HTML 5 的数据属性将被自动拉入到 jQuery 的数据对象中。jQuery 1.6 更改了对嵌入破折号的属性的处理,以符合 W3C HTML5 规范。

将您的代码段切换到 1.4.3 而不是 1.4.1 可以解决问题,以便.data('count')返回'0'. 请注意,您在设置数据时仍然有拼写错误(您使用.data('counter', ...)的是.data('count', ...).


推荐阅读