window.getSelection返回undefined或null

时间:2014-01-26 04:14:53

标签: javascript google-chrome google-chrome-extension

这可能是一个非常初学的问题,但是我要拔掉头发,因为我无法弄清楚我做错了什么。此时,我尝试做的就是让所选文本在警报或控制台中打印(用于测试)。我确保.toString()已将window.getSelection().方法添加到{ "manifest_version": 2, "name":"Testing", "version": "0.1", "icons": { "48":"48.png" }, "background": { "scripts": [ "background.js" ] }, "permissions":[ "tabs" ], "browser_action": { "default_icon": { "19":"img19.png" } } } 返回的对象中。无论我做什么,控制台和警报都显示为空白。谁能解释为什么?

我在本地Chrome扩展程序中执行此操作。

的manifest.json

chrome.browserAction.onClicked.addListener(function(tab) {
    var selObj = window.getSelection();
    var selectionText = selObj.toString();
    alert(selectionText);       // displays a blank alert
    console.log(selectionText); // adds a blank line in the console
});

的JavaScript

{{1}}

我正在学习。提前谢谢。

1 个答案:

答案 0 :(得分:6)

在研究过去24小时后,我终于找到了一个有效的解决方案。因为我正在访问DOM元素,所以我需要注入内容脚本并在后台脚本中来回传递信息。我还在我的清单中添加了activeTab权限。

<强>的manifest.json

{
    "manifest_version": 2,
    "name":"Simple Highlighter",
    "version": "1.0",
    "icons": {
        "19":"img19.png",
        "48":"48.png"
    },

    "content_scripts": [{                   
            // "matches": ["<all_urls>"],   only used for testing
            "js":["contentscript.js"]
        }],

     "background": {
        "scripts": [ "background.js" ]
    },

    "permissions":[ "tabs", "activeTab" ],

    "description": "Highlight web text and send it to a new Google Doc",

    "browser_action": {
        "default_icon": { "19":"img19.png" },
        "default_title":"Simple Highlighter"
    }
}

<强> background.js

chrome.browserAction.onClicked.addListener(function() {                                                 
    chrome.tabs.query({active: true, windowId: chrome.windows.WINDOW_ID_CURRENT}, function(tabs) {      
        chrome.tabs.sendMessage(tabs[0].id, {method: "getSelection"}, function(response){               
            sendServiceRequest(response.data);                                                          
        });
    });
});

function sendServiceRequest(selectedText) {                                         
    var serviceCall = 'http://www.google.com/search?q=' + selectedText;
    chrome.tabs.create({url: serviceCall});
}

<强> contentscript.js

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

显然,这并不是我原本打算做的事情。但是,我让它传递数据,所以接下来我将继续处理突出显示功能。

参考链接

Chrome Extension get selected text

about sending messages among bg.html, popup.html and contentscript.js