0

私は持っているクロム拡張機能を持っています

jquery.js、popup.js、link.js を呼び出す popup.html

    ...
    <script src="jquery.js"></script>
    <script src="popup.js"></script>
    <script src="link.js"></script>
  </head>

popup.js

var streamGenerator = {

  /* Twitch URL to the top 20 streams */
  searchOnTwitch_: 'https://api.twitch.tv/kraken/streams?limit=20',

  /* XHR Request to grab those streams */
  requestStreams: function() {
    var req = new XMLHttpRequest();
    req.open("GET", this.searchOnTwitch_, true);
    req.onload = this.showStreams_;
    req.send(null);
  },

  /* onload event inserting the streams into the DOM */
  showStreams_: function(e) {
    var streams = JSON.parse(e.target.responseText).streams;

    for (var i=0; i < streams.length; i++) {
      var stream = {
        game: streams[i].game,
        name: streams[i].channel.name,
        viewers: streams[i].viewers,
        link: streams[i].channel.url,
      };

      $('tbody').append('<tr>'
        + '<td>' + stream.game + '</td>'
        + '<td>' + '<a href=' + stream.link + '>' + stream.name + '</a></td>'
        + '<td>' + stream.viewers + '</td></a>'
      );
    }
  }
};

document.addEventListener('DOMContentLoaded', function() {
  streamGenerator.requestStreams();
});

そしてlink.js

$(function() {
  $('a').click(function(){
    chrome.tabs.create({url: $(this).attr('href')});
  });
})

ポップアップは機能し、表示されるはずのものを表示しますが、リンクは新しいタブを開きません。

Chrome のコンソールにアクセスしてもエラーは発生しませんが、link.js jquery をコピーして貼り付けると、リンクが機能します。

私は何を間違っていますか?!

4

1 に答える 1

1

popup.js あなたのコードは の前に 読み込まれますlink.js。関連する部分は次の順序で実行されます。

// popup.js
$(function() {
    $('a').click( ... );
})
// link.js
document.addEventListener('DOMContentLoaded', function() {
    streamGenerator.requestStreams(); //<-- Creates the links
});

$(func)は にほぼ等しいdocument.addEventListener('DOMContentLoaded', func)ので、実際に行っていることは次のようなものです。

// Run after the DOMContentLoaded "domready" event:
$('a').click(...);
streamGenerator.requestStreams(); // Creates the links

まず、clickイベントをすべての既存のアンカー (なし) にバインドしています。今後、新しいリンクを追加します。このシーケンスは明らかに機能しません。

popup.jsとの順序を入れ替えるか、イベント委任link.jsを使用することで解決できます。

$(document).on('click', 'a', function() {
    chrome.tabs.create({url: this.href});
});
于 2013-03-17T09:55:46.940 に答える