2010-12-07 7 views
17

Ich habe an einer kleinen Chrome-Erweiterung gearbeitet, mit einem Problem, das ich anscheinend nicht verstehe und würde es begrüßen, wenn jemand es mit einer neuen Perspektive betrachtet.Textauswahl und Anzeige im Kontextmenü chromextension

Das Ziel ist es, eine Chrome-Erweiterung zu erstellen, die es Ihnen ermöglicht, Text auf einer beliebigen Website auszuwählen und eine Option zum Senden der Auswahl an eine andere Website mit einem Kontextmenüelement anzuzeigen.

Mein manifest.json sieht wie folgt aus:

{ 
"name": "Context Menu Search", 
"description": "Opens the selected text as keyword in a new window", 
"version": "0.1", 
"permissions": ["contextMenus"], 
"background_page": "background.html" 
} 

Dann background.html:

<script src="rightclick.js"></script> 

Und rightclick.js:

var selection_callbacks = []; 
function getSelection(callback) { 
selection_callbacks.push(callback); 
    chrome.tabs.executeScript(null, { file:"selection.js" }); 
    }; 
    chrome.extension.onRequest.addListener(function (request) { 
    var callback = selection_callbacks.shift(); 
    callback(request); 
    }); 

function sendSearch(selectedText) { 
var serviceCall = 'http://www.google.com/search?q=' + selectedText; 
chrome.tabs.create({url: serviceCall}); 
} 
var tx = getSelection(); 
var title = "Test '" + tx + "' menu item"; 
var id = chrome.contextMenus.create({"title": title, "contexts":[selection], 
            "onclick": sendSearch(tx)}); 
console.log("selection item:" + id); 

Plus-selection.js:

chrome.extension.sendResponse(window.getSelection().toString()); 

Bisher das Kontextmenü Schöpfung funktioniert gut, aber der ausgewählte Text wird überhaupt nicht angezeigt. Wenn jemand Vorschläge zur Lösung dieses Problems und zur Vereinfachung des Skripts hat, würde ich mich über Ihre Eingabe freuen.

Vielen Dank.

Antwort

54

UPDATE

Ich sah sie nur an der docs und all dies kann sehr viel einfacher ohne Inhalt Skripte und Rückrufe erfolgen:

chrome.contextMenus.create({ 
    title: "Test %s menu item", 
    contexts:["selection"], 
    onclick: function(info, tab) { 
     sendSearch(info.selectionText); 
    } 
}); 

Das ist alles, was Sie brauchen, weil Sie %s verwenden können im Menütitel, um ausgewählten Text zu erhalten.

(alles unten nicht mehr benötigt)


Ihre getSelection() Methode gibt keinen markierten Text, es spritzt nur einen Content-Skript auf einer Seite. Ausgewählter Text wird irgendwann später in onRequest empfangen und dann von Ihrem Callback-Array als Parameter an eine Callback-Funktion übergeben.

So ist dieser Teil:

getSelection(function(tx) { 
    var title = "Test '" + tx + "' menu item"; 
    var id = chrome.contextMenus.create({"title": title, "contexts":["selection"], 
             "onclick": sendSearch(tx)}); 
    console.log("selection item:" + id); 
}) 

Aber ich würde loszuwerden dieser selection_callbacks insgesamt Array wie ich denke, es ist nicht erforderlich:

var tx = getSelection(); 
var title = "Test '" + tx + "' menu item"; 
var id = chrome.contextMenus.create({"title": title, "contexts":[selection], 
            "onclick": sendSearch(tx)}); 
console.log("selection item:" + id); 

Bedürfnisse zu so etwas wie dies geändert werden

chrome.extension.onRequest.addListener(function (request) { 
    var tx = request; 
    var title = "Test '" + tx + "' menu item"; 
    var id = chrome.contextMenus.create({"title": title, "contexts":["selection"], 
             "onclick": sendSearch(tx)}); 
    console.log("selection item:" + id); 
}); 

Beachten Sie auch, dass "contexts":[selection]sein mussund "onclick": sendSearch(tx) Bedürfnisse so etwas wie dies stattdessen sein:

"onclick": function(info, tab) { 
    sendSearch(info.selectionText); 
} 
+0

Vielen Dank für die ausführliche Antwort serg, links können Sie die aus s% im Code Teil Ihrer Antwort, aber ich habe es mit Ihrem Vorschlag arbeiten ! – baik

+1

Ist es möglich, den ausgewählten Text als zeilenweisen Inhalt mit neuen Zeilenzeichen zu erhalten? – Barani

+1

Und es kann sogar ein bisschen kürzer sein. Die [Beispielseite für contextMenus] (https://developer.chrome.com/extensions/samples#search:contextmenus) zeigt '' chrome.contextMenus.create ({"title": title, "contexts": [Kontext], "onclick": genericOnClick}); '', also ohne explizit die Parameter '' info'' und '' tab'' zu übergeben und eine anonyme Funktion zu erzeugen, die eine benannte Funktion aufruft. Ihr Beispiel wird zu: '' chrome.contextMenus.create ({title: "Test% s Menüelement", Kontexte: ["selection"], onclick: sendSearch (info.selectionText);}}); '' when '' Das erste Argument von sendSearch'' ist '' info''. –

Verwandte Themen