javascript - jquery 无法使用此选择器显示 div

Question

我正在查询 Twitch API 以获取我数据库中的用户列表，以查看他们是否在线。

我实质上是将它们全部列出，并带有“display: none”，然后在在线时取消隐藏:

  $('.online_list').each(function (index) {
      var tnick = $(this).data('tnick');
    $.getJSON("https://api.twitch.tv/kraken/streams?client_id={:twitch_key}&channel="+tnick+"", function(a) {
      if (a["streams"].length > 0)
      {
        alert(tnick);
        $(this).show();
        console.log(index + ": " + $( this ).text());
      }
    });
  });

在我的测试中，alert(tnick) 运行良好，所以我知道它正在运行。问题是 $(this).show(); 无法正常工作。

这是示例 HTML:

<div class="online_list" data-tnick="test" style="display: none;">test:<a href="https://www.twitch.tv/test">Twitch</a> <span>(Online)</span></div>
<div class="online_list" data-tnick="test2" style="display: none;">test2:<a href="https://www.twitch.tv/test2">Twitch</a> <span>(Online)</span></div>

Answer 1

this 是当前作用域对象!

要修复您的代码，您可以执行以下操作:

$('.online_list').each(function (index) {
    var $that = $(this); // create a temp var that
    var tnick = $that.data('tnick');
    $.getJSON("https://api.twitch.tv/kraken/streams?client_id={:twitch_key}&channel="+tnick+"", function(a) {
      if (a && a["streams"] && a["streams"].length > 0) {
        alert(tnick);
        $that.show(); // use that instead of this
        console.log(index + ": " + $that.text());
      }
    });
  });

查看此资源以获取有关范围和此的更多信息:http://javascriptplayground.com/blog/2012/04/javascript-variable-scope-this/