在Chrome扩展程序中关闭弹出窗口后记住数组

Yin Cognyto

我有一些编程知识,但是我以前并没有广泛地使用Javascript或处理过Chrome扩展程序。我正在寻找一个Chrome扩展程序,该扩展程序可以在新标签页中打开所选链接(这是我要实现的初始目标,因为我的最终目标是在同一标签页的框架中打开链接(如果可能),以保存这些链接中的图像,类似于Firefox的“保存图像”扩展程序所做的。

但是,我有一个问题:关闭弹出窗口后(由于打开了新的选项卡),无法“记住”从我的弹出窗口中选择的链接以便使用延迟打开它们。我想这与不制作后台脚本来执行操作有关,而不是与popup.js有关?也许在这两个Javascipt文件之间传递了一些消息?只是在这里猜...

到目前为止,这是我的代码:

manifest.json

{
  "name": "Get links",
  "version": "1.0",
  "manifest_version": 2,
  "description": "Get links from a page",
  "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "popup.html"
  },
  "permissions": ["tabs", "downloads", "<all_urls>"]
}

popup.html

<!DOCTYPE html>
<html>
  <head>
    <script src="popup.js"></script>
  </head>
  <body style="width:400px;">
    <form id="linksform">
      <p>
        <label for="matchregex" style="margin-left: 7px;">RegEx Match: </label>
        <input id="regextext" type="text" style="width:90px;" name="matchregex" value="" />
        <input id="togglematches" type="button" value="Toggle Matches" />
        <input id="openselected" type="button" value="Open Selected" />
      </p>
      <table id='links'>
        <th></th>
      </table>
    </form>
  </body>
</html>

popup.js

var alllinks = [];
var visiblelinks = [];
var selectedlinks = [];
var delay = 1000;

// Display all visible links.

function showlinks()
  {
  var togglematchesbutton = document.getElementById('togglematches');
  var openselectedbutton = document.getElementById('openselected');
  var linkstable = document.getElementById('links');
  while (linkstable.children.length > 1)
    {
    linkstable.removeChild(linkstable.children[linkstable.children.length - 1])
    }
  for (var i = 0; i < visiblelinks.length; ++i)
    {
    var row = document.createElement('tr');
    var col0 = document.createElement('td');
    var col1 = document.createElement('td');
    var checkbox = document.createElement('input');
    checkbox.type = 'checkbox';
    checkbox.id = 'check' + i;
    checkbox.checked = false;
    checkbox.value = visiblelinks[i];
    col0.appendChild(checkbox);
    col1.innerText = visiblelinks[i];
    col1.style.whiteSpace = 'nowrap';
    col1.onclick = function()
      {
      checkbox.checked = !checkbox.checked;
      }
    row.appendChild(col0);
    row.appendChild(col1);
    linkstable.appendChild(row);
    }
  togglematchesbutton.onclick = function()
    {
    var regex = new RegExp(document.getElementById("regextext").value);
    var getinputs = document.getElementsByTagName("input");
    for (var i = 0, max = getinputs.length; i < max; i++)
      {
      if ((getinputs[i].type === 'checkbox') &&  (regex.test(getinputs[i].value))) getinputs[i].checked = !getinputs[i].checked;
      }
    }
  openselectedbutton.onclick = function()
    {
    var getinputs = document.getElementsByTagName("input");
    for (var i = 0, max = getinputs.length; i < max; i++)
      {
      if ((getinputs[i].type === 'checkbox') && (getinputs[i].checked))
        {
        selectedlinks.push(getinputs[i].value);
        }
      }
    for (var i = 0, max = selectedlinks.length; i < max; i++)
      {
      window.setTimeout(function() {chrome.tabs.create({url: selectedlinks[i]});}, delay);
      //chrome.tabs.create({url: selectedlinks[i]});
      }
    }
  }

// Add links to alllinks and visiblelinks, sort and show them. Sendlinks.js is
// injected into all frames of the active tab, so this listener may be called
// multiple times.

chrome.extension.onMessage.addListener
  (
  function(links)
    {
    for (var index in links)
      {
      alllinks.push(links[index]);
      }
    alllinks.sort();
    visiblelinks = alllinks;
    //console.log(links);
    showlinks();
    }
  );

// Set up event handlers and inject sendlinks.js into all frames in the active
// tab.

window.onload = function()
  {
  chrome.windows.getCurrent
    (
    function (currentWindow)
      {
      chrome.tabs.query
        (
        {active: true, windowId: currentWindow.id},
        function(activeTabs)
          {
          chrome.tabs.executeScript(activeTabs[0].id, {file: 'sendlinks.js', allFrames: true});
          }
        );
      }
    );
  };

sendlinks.js

// Send back to the popup a sorted deduped list of valid link URLs on this page.
// The popup injects this script into all frames in the active tab.
console.log("Injected");

var links = [].slice.apply(document.getElementsByTagName('a'));
console.log(links);
links = links.map
  (
    function(element)
    {
    // Return an anchor's href attribute, stripping any URL fragment (hash '#').
    // If the html specifies a relative path, chrome converts it to an absolute
    // URL.
    var href = element.href;
    var hashIndex = href.indexOf('#');
    if (hashIndex >= 0)
      {
      href = href.substr(0, hashIndex);
      }
    return href;
    }
  );

links.sort();

// Remove duplicates and invalid URLs.
var kBadPrefix = 'javascript';
for (var i = 0; i < links.length;)
  {
  if (((i > 0) && (links[i] == links[i - 1])) || (links[i] == '') || (kBadPrefix == links[i].toLowerCase().substr(0, kBadPrefix.length)))
    {
    links.splice(i, 1);
    }
  else
    {
    ++i;
    }
  }
console.log(links);

chrome.extension.sendMessage(links);

注意:该代码的大部分内容取自其他地方,并已进行修改以满足我的需要。

主要问题是来自popup.js的以下代码段:

for (var i = 0, max = selectedlinks.length; i < max; i++)
  {
  window.setTimeout(function() {chrome.tabs.create({url: selectedlinks[i]});}, delay);
  //chrome.tabs.create({url: selectedlinks[i]});
  }

如果我注释了setTimeout行并取消注释了以下行,则它可以工作(例如,扩展名成功打开了选项卡),但是它不会在打开连续的选项卡之间使用延迟-避免在某些情况下出现“太多请求”错误是必需的网站。如果我照原样进行操作,它将打开应该打开的选项卡数量(使用指定的延迟),但是这些选项卡的url与所选值不匹配(基本上是空白)。我想要的是后者,但是要打开选定的链接而不是空白标签。

您能否指出我的错误所在,并建议修改代码以使其正常工作?如果可行,请保持现有代码与发布的版本尽可能接近(也可以对源代码进行少量修改)。谢谢。

Yin Cognyto

没关系,我解决了这个问题。事实证明,由于某种原因,Chrome不会记住循环中i变量for(可能是由于延迟而settimeout()for循环相比是异步的吗?),因此它无法引用正确的数组元素。

我要做的就是替换上面的内容

window.setTimeout(function() {chrome.tabs.create({url: selectedlinks[i]});}, delay);

window.setTimeout(function() {chrome.tabs.create({url: selectedlinks.shift()});}, delay);

它完美地工作了。基本上,更新的代码始终使用第一个数组元素,同时将其删除,而不是使用i变量来引用该数组元素,从而“导航”整个数组并消除为其创建选项卡的元素。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

禁止关闭Chrome扩展程序弹出窗口

Chrome扩展程序-jQuery关闭模式弹出窗口

当用户在单独的chrome窗口中时,是否可以关闭chrome扩展程序弹出窗口?

Chrome扩展程序代码可在弹出窗口中打开或关闭我的扩展程序

如何防止我的Chrome扩展程序中的弹出窗口放大

在 Google Chrome 扩展程序中获取打开的弹出窗口

在 chrome 扩展程序中创建一个弹出窗口

Chrome扩展程序在页面操作中显示弹出窗口

在chrome扩展程序中打开和访问弹出窗口

关闭按钮可在Chrome扩展程序弹出窗口中打开新的Chrome存储标签

Chrome扩展程序弹出关闭事件

Chrome扩展程序弹出窗口不再显示

如何缩小Chrome扩展程序的弹出窗口

Chrome扩展程序弹出窗口无法打开

关闭 Javascript 警报后防止关闭 Chrome 扩展弹出窗口

关闭和打开Chrome扩展程序弹出窗口时如何不丢失数据

Google Chrome扩展程序:模态/弹出窗口关闭时发出警报

无法在Chrome扩展程序中从内容脚本通信到弹出窗口

每次加载页面时,如何从后台向 Chrome 扩展程序中的弹出窗口发送消息?

在Chrome扩展程序中,是否可以截屏并在弹出窗口中显示屏幕?

Chrome扩展程序中的数据未从弹出窗口传递到后台

在Chrome扩展程序中创建HTML对话框弹出窗口

如何在Chrome扩展程序中仅显示一次弹出窗口?

如何在Chrome扩展程序中显示弹出式窗口?

如何阅读在线资源并更新Google Chrome扩展程序中的弹出窗口

Chrome扩展程序:从弹出窗口获取当前标签

Chrome扩展程序弹出窗口中未定义“ $”

简单的Chrome扩展程序不会显示弹出窗口

Chrome扩展程序脚本仅在显示弹出窗口时运行