Question

我尝试在检测到data-voted属性为"true"时将某个类分配给该元素，但是简单的addClass行无效。

我正在使用$(this)，直到我阅读jQuery的each()文档，然后切换到以下内容：

windowReady = ->
  jQuery -> 
    $voteLinks = $('.vote-button a')

    $voteLinks.each (i, current) ->
      if $(current).data('voted') == "true" 
        $(current).addClass('voted')

$(window).load(windowReady);
$(window).on('page:load', windowReady);

$(this)

windowReady = ->
  jQuery -> 
    $voteLinks = $('.vote-button a')

    $voteLinks.each ->
      if $(this).data('voted') == "true" 
        $(this).addClass('voted')

$(window).load(windowReady);
$(window).on('page:load', windowReady);

但即便如此，我仍然没有分配课程，即使我已确认它确实具有data-voted的{{1}}属性

CoffeesSript可以在js2coffee转换为Javascript。

Answer 1

windowReady = ->
  jQuery -> 
    $voteLinks = $('.vote-button a')

    $voteLinks.each (i, current) ->
      if $(current).data('voted') == true
        $(current).addClass('voted')

$(window).load(windowReady);
$(window).on('page:load', windowReady);

显然，幕后会有一些翻转。

coffeescript通常需要==并将其转换为===。所以根据===，它也应该检查类型。因此，当data-voted为"true"时，您认为必须将其与"true"进行比较。 NOPE。

显然，您通过.data()，"true"或"false"引用或获取的任何数据都会被转回布尔值true / false。

因此你必须将coffeescript保留为使用==，它在javascript中实际上是===，它检查变量的类型（需要是布尔值，而不是字符串）。

隐含的背景疯狂。文档，文档，文档。缺乏它，或不读它会浪费生命。因此，文档可以挽救生命xp

Answer 2

作为@gwho答案的补充，这种隐式类型转换实际上是documented feature of JQuery：

HTML5数据 - *属性

每次尝试将字符串转换为JavaScript值   （这包括布尔值，数字，对象，数组和null）。一个值   如果这样做不会更改值，则只会转换为数字   表示。例如，＆＃34; 1E02＆＃34;和＆＃34; 100.000＆＃34;相当于   数字（数值100）但转换它们会改变它们的数字   表示所以它们被保留为字符串。字符串值＆＃34; 100＆＃34;是   转换为数字100。

[...]

要将值的属性检索为字符串而不进行任何尝试   转换它，使用attr（）方法。

如上所述，如果你不喜欢＆＃34;隐式转换，您可能更喜欢使用attr()（使用完整的属性名称）而不是data()：

windowReady = ->
  jQuery -> 
    $voteLinks = $('.vote-button a')

    $voteLinks.each (i, current) ->
      if $(current).attr('data-voted') == "true" 
        $(current).addClass('voted')

如果你能接受这种隐含的转换：

windowReady = ->
  jQuery -> 
    $voteLinks = $('.vote-button a')

    $voteLinks.each (i, current) ->
      if $(current).data('voted') == true 
        $(current).addClass('voted')

为什么不javascript＆＃34;这＆＃34;使用＆＃34;每个＆＃34;？

2 个答案:

**HTML5数据 - *属性**