Chrome Selection.addRange()不选择(execCommand(‘execCommand’)用例)

Question

用Chrome编写一个很小的浏览器扩展，将特定的文本从特定的网页复制到剪贴板上。在HTML格式下，人们可以将它粘贴到诸如word、outlook等办公程序中。

document.execCommand('copy')是我使用的命令，它是由document.onkeydown键组合(Alt+1)触发的，它运行良好--但这是第一次。如果你再一次按下组合键，它就什么也做不了。

我已经找到了原因，document.queryCommandEnabled("copy")第一次返回true，任何其他尝试都返回false。如果我重新加载页面，它将第一次返回true。此外，如果我在加载页面后单击浏览器窗口外部，然后在浏览器中单击并使用键组合，则立即返回false，甚至是第一次。

function copy(text) {
  var sel = document.createElement("div"); // Creating temporary holder for text to copy

  sel.style.opacity = 0;             sel.style.position = "absolute";  // These are not really required,
  sel.style.pointerEvents = "none";  sel.style.zIndex = -1;            // at least for Chrome

  sel.innerHTML = text; // Put the text to copy into the temporary holder

  document.body.appendChild(sel); // Add the temporary holder to the page

  var range = document.createRange();     // All this is required to select the text,
  range.selectNode(sel);                  // since the holder is not an editable text
  window.getSelection().addRange(range);  // field and must be treated differently.

  // document.designMode = 'on'; (Tried this, no effect)

  /* Debugging */ alert("Enabled = " + document.queryCommandEnabled("copy") + " Design mode = " + document.designMode);

  try {
    document.execCommand('copy'); // Copy to clipbopard
  }
  catch (err) {
    alert('Unable to copy');
    console.log('Unable to copy'); // Copy failed?!
  }

  // document.designMode = 'off'; (Tried this, no effect)

  document.body.removeChild(sel); // Clean up removing the temporary holder
}

document.onkeydown=function(e){
  if(e.altKey && e.which == 49) { // Alt+1
    copy(link_variable);
    return false;
  }
}

有什么想法吗？

添加清单文件：

{
  "manifest_version": 2,
  "name": "Usage text",
  "version": "0.2",
  "description": "Whatever",
  "content_scripts": [
    {
      "matches": [
        "*://some.specific.site.com/*"
      ],
      "js": ["content.js"]
    }
  ],
  "background": {
    "scripts": ["background.js"]
  },
  "browser_action": {
      "name": "Whatever",
      "default_icon": "icon.png"
  },
  "permissions": [
    "tabs",
    "clipboardWrite"
  ]
}

更新：

将操作从content脚本传输到背景脚本，没有任何更改。

Answer 1

当尝试使用问题铬59中的代码时，会记录此警告：

反对Selection.addRange()合并现有范围并移除指定范围的行为。有关更多详细信息，请参阅https://www.chromestatus.com/features/6680566019653632。

那

1. 带我到上面提到的铬状态 在文档已经有文本选择并调用Selection.addRange()的情况下，如果范围和现有文本选择有重叠，则Blink将它们合并为一个，否则什么也不做。我们会改变它，让眨眼总是忽略范围。它与边缘相匹配。

哪一个

1. 带我去关于W3C规范的讨论
2. 让我读了W3C规范。

根据规范，如果已经有选择，addRange()不应该做任何事情：

1. 如果rangeCount不是0，请中止这些步骤。

所以有趣的是，似乎已经有了选择。检查window. getSelection().rangeCount证实了这一点。我无法解释这是为什么，但这是问题中提到的问题的原因。

在removeAllRanges()解决问题之前调用addRange()：

var sel = window.getSelection();
sel.removeAllRanges();
sel.addRange(range);