0

Chrome 拡張機能を作成していますが、イベント リスナーを正しく動作させるのに苦労しています。

マニフセット.json

{
  "manifest_version": 2,

  "name": "Test",
  "description": "testing this",
  "version": "1.0",

  "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "popup.html"
  },
  "permissions": [
    "bookmarks"
  ]
}

popup.html

<!doctype html>
<html>
  <head>
    <title>Testing</title>
    <style>
      body {
        min-width: 357px;
        overflow-x: hidden;
      }

      img {
        margin: 5px;
        border: 2px solid black;
        vertical-align: middle;
        width: 75px;
        height: 75px;
      }
    </style>
    <script src="popup.js"></script>
  </head>
  <body>
  </body>
</html>

popup.js

document.addEventListener('DOMContentLoaded', function () {
  chrome.bookmarks.getTree(function (stuff){
    traverseBookmarks(stuff[0].children[0].children);
  });
});

  function traverseBookmarks(bookmarkTreeNodes) {
    for(var i=0;i<bookmarkTreeNodes.length;i++) {
      var bookmark = document.createElement('a');

      if(bookmarkTreeNodes[i].url){
        console.log("here mother");
        bookmark.href = bookmarkTreeNodes[i].url;
        bookmark.target = "_blank";
      }
      else{
        bookmark.addEventListener("click", addChildren(bookmarkTreeNodes[i].children), false);
      }
      bookmark.innerHTML = bookmarkTreeNodes[i].title;
      document.body.appendChild(bookmark);
      document.body.appendChild(document.createElement("br"));

      if(bookmarkTreeNodes[i].children) {
        traverseBookmarks(bookmarkTreeNodes[i].children);
      }
    }
  }

  function addChildren(children) {
    var windows = "";
    for(var i = 0; i < children.length; i++){
      window.open(children[i].url);
      // windows += 'window.open(' + children[i].url + ');';
    }
    return windows;
  }

私が遭遇している問題は、拡張機能のアイコンをクリックしてポップアップを開くたびに、イベントリスナーの最初のリンクがトリガーされ、最初のタブしか開かないことです。

目標は、フォルダー (フォルダーを象徴するリンクのみ) をクリックして、そのフォルダー内のすべてのリンクを開くことができるようにすることです。どんな助けでも大歓迎です。何か明確にする必要がある場合はお知らせください。

4

1 に答える 1

1 
bookmark.addEventListener("click", 
                           addChildren(bookmarkTreeNodes[i].children), false);

ここで関数を実行しています

addChildren(bookmarkTreeNodes[i].children)
           ^                             ^
           |                             |

参照を渡す必要があります

bookmark.addEventListener("click", addChildren, false);

代わりに、ハンドラーをクロージャーでラップして、現在の値を IIFE に渡すことがiできます。

(function(num) {
    bookmark
     .addEventListener("click", function() {               
                                  addChildren(bookmarkTreeNodes[num].children) })
                               } , false );
})(i);
于 2013-05-23T19:10:02.013 に答える