无法确定div元素是否已在chrome扩展中设置在body中

时间:2013-10-25 09:51:35

标签: javascript jquery html google-chrome google-chrome-extension

在我的chrome扩展程序中,我得到了一个div,我将添加到当前标签的正文中。我正在听chrome.tabs.onUpdated。如果调用此事件,我将在content_scripts中执行脚本。在这个函数中,我会等到文档准备好jQuery $(document).ready(...)。 我尝试访问

$("#div").length

有时它会返回1,有时会返回0.它应该添加到正文中,如果它还没有。

由于某些奇怪的原因,每次重新加载页面时都会调用onUpdated事件两次。实际上我发现没有办法安全检查div是否已经添加。

编辑:我的代码:

inject.js:

var crendentials;
var mailInfo;

function doLogin(username, password)
{
    function verifyLogin(username, password)
    {
        $.get("www.example.com&login&username=" + username + "&password=" + password,
              function (data)
              {
                 if (!isNaN($.trim(data)))
                 {
                    crendentials = new Array();
                    crendentials[0] = username;
                    crendentials[1] = password;

                    chrome.storage.sync.set({ key: "example_toolbar", value: username + ";;;" + password});
                    chrome.storage.sync.set({ key: "example_toolbar_verified", value: 1});
                }
                else
                {
                   chrome.storage.sync.set({ key: "example_toolbar_verified", value: 0});
                }
              }
       );
    }
    if (typeof username === "undefined" || username === null || username === ""
        || typeof password === "undefined" || password === null || password === "")
    {
        var crentest;
        chrome.storage.sync.get("example_toolbar",
                               function (value)
                               {
                                  console.log("value von doLogin()", value.example_toolbar);
                                  crentest = value.example_toolbar;
                               }
                            );
        if (typeof crentest !== "undefined" && crentest !== null && crentest !== "")
        {
            chrome.storage.sync.get("example_toolbar",
                                    function (value)
                                    {
                                       crendentials = value.example_toolbar.split(";;;");
                                    }
                                );
        }
   }
   else
   {
      verifyLogin(username, password);
   }
}


function getMailInfos(callback)
{
    if (typeof mailInfo === "undefined")
    {
       $.get("http://www.example.com&mailapi=showmails",
             function (data)
             {
                 mailInfo = new Array();
                 var infos = data.split("|");
                 mailInfo.unread = infos[0];
                 mailInfo.total = infos[1];
                 callback();
             }
        );
    }
    else
    {
      callback();
    }

}

function getMails(callback)
{
    if (typeof mailInfo === "undefined")
    {
       getMailInfos(function ()
                   {
                      callback(mailInfo.unread);
                   }
        );
    }
    else
    {
       callback(mailInfo.unread);
    }
}

function renderText(textstr)
{
   var divText = document.createElement("div");
   addClass(divText, "toolbarText");
   var text = document.createTextNode(textstr);
   divText.appendChild(text);
  toolbar.appendChild(divText);
}

var mailAmountDiv;
function renderMail(callback)
{
   var mailIco = document.createElement("div");
   addClass(mailIco, "mailIcon");
   mailAmountDiv = document.createElement("div");
   mailAmountDiv.id = "mails_unread";
   addClass(mailAmountDiv, "mailAmount");
   mailIco.appendChild(mailAmountDiv);
   getMails(function (value)
            {
               var mailAmount = document.createTextNode(value);
               mailAmountDiv.appendChild(mailAmount);
               toolbar.appendChild(mailIco);
               renderPlaceholderSmall();
               renderText(translations.notAttended + ": " + getNotRead());
            }
    );
}

function createToolbar(change)
{
   $(document).ready(function()
                    {

                       console.log("ist vorhanden: ", $("#Example-Toolbar").length);
                       if ($("#Example-Toolbar").length > 0)
                       {
                          // already created, stop working here
                          return;
                       }
                       doLogin();
                       toolbar = document.createElement("div");
                       toolbar.id = "Example-Toolbar";
                       renderMail(function()
                                  {
                                      renderPlaceholderLarge();
                                      renderSearch();
                                      renderPlaceholderSmall();
                                      renderRightIcons();
                                      $("body").css({"margin-top": "23px", "z-index": -1});
                                      //document.body.insertBefore(toolbar, document.body.childNodes[0]);
                                      $(toolbar).prependTo("body");
                                  }
                        );
                  }
            );
}

background.js:

function tabListener(tabId, changeInfo, tab)
{
   // exec script on current focused tabId
  chrome.tabs.executeScript(tabId,
                            {
                               code: 'createToolbar();'
                            }
              );
}

chrome.tabs.onUpdated.addListener(tabListener);

manifest.json(仅限必要部分):

"background": {
    "scripts": [
        "background.js"
    ]
},

"permissions": [
    "tabs",
    "http://*/",
    "https://*/",
    "file:///*/*",
    "storage"
],

"content_scripts": [{
    "matches": ["*://*/*"],
    "css": ["jquery-ui.css", "style.css"],
    "js": ["jquery-2.0.3.min.js", "jquery-ui.min.js", "inject.js"],
    "run_at": "document_start"
}]

0 个答案:

没有答案