Кнопка во всплывающем окне, которая получает выделенный текст - расширение Chrome - PullRequest
1 голос
/ 22 сентября 2010

В моем popup.html в моем расширении chrome у меня есть кнопка, которая получит выделенный текст на веб-странице de и поместит его в текстовое поле popup.html.

  1. Сначала я выбираю текст на веб-странице
  2. Я нажимаю на свое расширение. Появится всплывающее окно с текстовой областью и кнопкой.
  3. Когда я нажимаю кнопку, выбранный текст будет отображаться в моей текстовой области.

- это тот, кто может помочь мне с этой проблемой,

Спасибо

Wouter

1 Ответ

18 голосов
/ 23 сентября 2010

Если вы хотите реализовать это, вам понадобится пара API.

Вам необходимо убедиться в скриптах содержимого , чтобы захватить выделение в DOM. Затем вам нужно использовать Message Passing , чтобы всплывающее окно связывалось со сценарием содержимого. После того, как вы все это сделаете, вы можете просто использовать chrome.tabs.sendRequest , чтобы отправить сообщение в сценарий содержимого, чтобы получить ответ с данными.

Например, вот как вы можете создать всплывающее окно, которое выбирает текущий выбор:

popup.html

<!DOCTYPE html> 
<html>
<head>
<style>
  body { width: 300px; }
  textarea { width: 250px; height: 100px;}
</style>
<script>
function pasteSelection() {
  chrome.tabs.getSelected(null, function(tab) {
    chrome.tabs.sendRequest(tab.id, {method: "getSelection"}, function (response) {
      var text = document.getElementById('text'); 
      text.innerHTML = response.data;
    });
  });
}
</script>
</head>
<body>
<textarea id="text"> </textarea>
<button onclick="pasteSelection(); ">Paste Selection</button>
</body>
</html>

selection.js

chrome.extension.onRequest.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",
 "browser_action": {
   "default_title": "Selected Text",
   "default_icon": "online.png",
   "default_popup": "popup.html" 
 },
 "permissions": [
   "tabs",
   "chrome://favicon/",
   "http://*/*", 
   "https://*/*"
 ],
 "content_scripts": [
  {
    "matches": ["http://*/*"],
    "js": ["selection.js"],
    "run_at": "document_start",
    "all_frames": true
  }
 ]
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...