根据你的需求,我将修改代码以监听用户的文本选择操作,并将所选内容发送给后台。

首先,更新清单文件(manifest.json)中的代码如下:

{
  "manifest_version": 3,
  "name": "Dropdown Select",
  "version": "1.0",
  "permissions": [
    "activeTab"
  ],
  "background": {
    "service_worker": "background.js"
  },
  "icons": {
    "16": "icon.png",
    "48": "icon.png",
    "128": "icon.png"
  }
}

然后,更新background.js文件中的代码如下:

chrome.runtime.onInstalled.addListener(function() {
  chrome.action.onClicked.addListener(handleClick);
});

function handleClick(tab) {
  chrome.scripting.executeScript({
    target: { tabId: tab.id },
    function: injectHTML
  });
}

function injectHTML() {
  document.addEventListener('selectionchange', function() {
    var selectedText = document.getSelection().toString();
    chrome.runtime.sendMessage({ action: 'selectedText', text: selectedText });
  });
}

在上述代码中,我们使用chrome.action.onClicked事件监听用户点击插件图标的动作,并调用handleClick函数。在handleClick函数中,我们执行executeScript方法来注入HTML,并在注入的HTML中监听selectionchange事件。每当用户选择文本时,我们获取所选内容并通过chrome.runtime.sendMessage方法将其发送给后台。

最后,我们需要更新content.js文件中的代码如下:

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
  if (request.action === 'selectedText') {
    console.log('Selected Text:', request.text);
    // 在这里进行你想要执行的操作,比如发送给后台处理等
  }
});

在上述代码中,我们使用chrome.runtime.onMessage事件监听来自background.js发送的消息,并根据消息中的内容执行相应的操作。在这个例子中,我们只是简单地将所选内容打印到控制台,你可以在这里进行你自己的操作,比如将所选内容发送给后台进行处理。

请记住,在这个示例中,我们只展示了如何监听文本选择并将其发送给后台。实际应用中,你可以根据自己的需求进一步进行处理和操作。希望这次能满足你的需求!如有任何问题,请随时提问。

Chrome 扩展:监听文本选择并发送至后台

原文地址: https://www.cveoy.top/t/topic/TuL 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录