2016-10-02 39 views
3

我無法弄清楚如何從我的內容腳本發送一些數據到popup.html。這是一個點擊元素的xpath。我很新Chrome擴展程序所以也許很明顯。如何接收從內容腳本發送到popup.js/html的消息?

我已閱讀關於消息傳遞的文章,但我在那裏有一個混亂。

我想出如何發送來自xpathget.js的消息,但我不知道如何接收它並在popup.html上顯示它,因爲它在點擊某個元素後關閉。

manifest.json的

{ 
    "manifest_version": 2, 
    "name": "Product", 
    "description": "This is a plugin collaborating with product.com", 
    "version": "1.0", 
    "browser_action": { 
    "default_icon": "spy-icon.png", 
    "default_popup": "popup.html", 
    "default_title": "Click here!" 
    }, 
    "icons":{ 
    "64":"spy-icon.png" 
    }, 
    "background": { 
    "scripts": ["authentication.js"] 
    }, 
    "content_scripts": [ 
    { 
     "matches": ["<all_urls>"], 
     "js": ["xpathget.js"] 
    } 
    ], 
    "permissions": [ 
    "activeTab", 
    "https://ajax.googleapis.com/", 
    "cookies", 
    "<all_urls>" 
    ], 
    "content_security_policy": "script-src 'self' https://ajax.googleapis.com; object-src 'self'" 
} 

popup.js

$(document).ready(function() { 
    $('body').height(280); 
    $('html').height(280); 
    MESSAGE_GET_HANDLER(){ 
     ALTER_THE_HTML; 
    } 
}); 

我想,我必須xpath字符串給popup.js然後改變popup.html HTML和它的完成。

xpathget.js

document.onclick= function(event) { 
    if (event===undefined) event= window.event;      // IE hack 
    var target= 'target' in event? event.target : event.srcElement; // another IE hack 

    var root= document.compatMode==='CSS1Compat'? document.documentElement : document.body; 
    var mxy= [event.clientX+root.scrollLeft, event.clientY+root.scrollTop]; 

    var path= getPathTo(target); 
    var txy= getPageXY(target); 
    chrome.runtime.sendMessage({xpath: path}, function() { 
     alert('sent'); 
    }); <== I HAVE TO SEND THIS PATH TO PLUGIN 
} 

function getPathTo(element) { 
    if (element.id!=='') 
     return 'id("'+element.id+'")'; 
    if (element===document.body) 
     return element.tagName; 

    var ix= 0; 
    var siblings= element.parentNode.childNodes; 
    for (var i= 0; i<siblings.length; i++) { 
     var sibling= siblings[i]; 
     if (sibling===element) 
      return getPathTo(element.parentNode)+'/'+element.tagName+'['+(ix+1)+']'; 
     if (sibling.nodeType===1 && sibling.tagName===element.tagName) 
      ix++; 
    } 
} 

function getPageXY(element) { 
    var x= 0, y= 0; 
    while (element) { 
     x+= element.offsetLeft; 
     y+= element.offsetTop; 
     element= element.offsetParent; 
    } 
    return [x, y]; 
} 
+1

你能更好地解釋你的擴展中實際發生了什麼嗎?點擊頁面上應該打開彈出窗口並傳遞消息的內容?這裏的流量不完全清楚。 – DelightedD0D

回答

0

有沒有辦法讓工具欄彈出打開,一旦你點擊一個網頁或外部彈出的任何地方。一旦它關閉,它的環境/上下文/對象和事件監聽器就不再存在了。
工具欄彈出窗口也無法以編程方式重新打開。

繼續在DOM對話框/ div中添加到互動,例如uBlock's element picker does.或打開一個新窗口'popup'類型通過chrome.windows.create