Creating a chrome extension which takes highlighted text on the page and inserts it into a textarea in popup.html

前端未结

关注

 2  1544

I have spent several hours searching the web for solutions. What I would like to do is take the highlighted text on a page and transfer it to a textarea in the popup.html of

相关标签:

2条回答

我寻月下人不归

2020-12-24 04:43

Well just like the answer to the question you linked, you will need to make use of Message Passing and Content Scripts. That code is over 2 years old though and makes use of depreciated methods such as onRequest and getSelected. A few simple modifications should be plenty to update it to the new api's.

Popup.html

<!DOCTYPE html> 
<html>
  <head>
    <script src="jquery-1.8.3.min.js"></script>
    <script src="popup.js"></script>
    <style>
      body { width: 300px; }
      textarea { width: 250px; height: 100px;}
    </style>
  </head>
  <body>
    <textarea id="text"> </textarea>
    <button id="paste">Paste Selection</button>
  </body>
</html>

popup.js (so as to not have any inline code)

$(function(){
  $('#paste').click(function(){pasteSelection();});
});
function pasteSelection() {
  chrome.tabs.query({active:true, windowId: chrome.windows.WINDOW_ID_CURRENT}, 
  function(tab) {
    chrome.tabs.sendMessage(tab[0].id, {method: "getSelection"}, 
    function(response){
      var text = document.getElementById('text'); 
      text.innerHTML = response.data;
    });
  });
}

selection.js

chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
  if (request.method == "getSelection")
    sendResponse({data: window.getSelection().toString()});
  else
    sendResponse({}); // snub them.
});

manifest.json

{
 "name": "Selected Text",
 "version": "0.1",
 "description": "Selected Text",
 "manifest_version": 2,
 "browser_action": {
   "default_title": "Selected Text",
   "default_icon": "online.png",
   "default_popup": "popup.html" 
 },
 "permissions": [
   "tabs",
   "<all_urls>"
 ],
 "content_scripts": [
   {
     "matches": ["<all_urls>"],
     "js": ["selection.js"],
     "run_at": "document_start",
     "all_frames": true
   }
 ]
}

Here is a link to source files.

0 讨论(0)

既然无缘

2020-12-24 04:55
popup.js
```
chrome.tabs.executeScript( {
  code: "window.getSelection().toString();"
}, function(selection) {
  alert(selection[0]);
});
```
manifest.json
```
"permissions": [
    "activeTab",
],
```
Have a look at this simple extension https://github.com/kelly-apollo/zdic
0 讨论(0)
发布评论:

提交评论
- 加载中...