向所有元素添加點擊事件偵聽器 - Firefox插件

我想爲頁面中的所有html元素分配點擊處理程序。但用戶點擊我的插件按鈕，而不是在頁面加載。向所有元素添加點擊事件偵聽器 - Firefox插件

以下是出發點。我無法設法分配全局點擊處理程序。有什麼想法？謝謝。

var buttons = require('sdk/ui/button/action'); 

var button = buttons.ActionButton({ 
    id: "fieldResolver", 
    label: "Field Resolver", 
    icon: { 
    "16": "./icon-16.png", 
    "32": "./icon-32.png", 
    "64": "./icon-64.png" 
    }, 
    onClick: handleClick 
}); 

function handleClick() { 

}

時使用jQuery我得到這個錯誤，所以jQuery是不是一種選擇：消息：的ReferenceError：$沒有定義無論是文檔對象是不可用

來源

2014-07-15 leitmotif

首先，你的附加住在一個不同的，更多的特權環境中比在頁面代碼的代碼 - 在不遠的未來，他們會還有兩個不同的過程 - 所以你沒有交流直接訪問該頁面：您必須使用content script。我建議你仔細閱讀鏈接的頁面，因爲它會向你提供他們如何相互溝通。

說的是，我的想法是：當用戶點擊一個按鈕時，將內容腳本附加到當前頁面（如果還沒有的話）。在內容腳本中，聽取點擊事件，並做你的東西。

這裏的例子爲您main.js

const { ActionButton } = require("sdk/ui/button/action"); 
const { data } = require("sdk/self") 
const tabs = require('sdk/tabs'); 

let button = ActionButton({ 
    id: "fieldResolver", 
    label: "Field Resolver", 
    icon: { 
    "16": "./icon-16.png", 
    "32": "./icon-32.png", 
    "64": "./icon-64.png" 
    }, 
    onClick: handleClick 
}); 

function handleClick() { 
    // get the current tab 
    let tab = tabs.activeTab; 

    // you would probably want to store worker somewhere to be sure 
    // that you won't attach more than once 
    let worker = tab.attach({ 
    contentScriptFile: data.url("content.js") 
    }); 
}

正如你所看到的，你需要一個contentScriptFile，即必須是在你的附加組件的數據文件夾。你content.js意志的樣子：

function clickHandler (event) { 
    // do something with the element clicked 
    console.log(event.target.outerHTML); 
} 

window.addEventListener("click", clickHandler); 

// We want to clean the page if the worker is destroyed 
self.port.on("detach", function() { 
    window.removeEventListener("click", clickHandler); 
})

可以卸下工作人員打電話worker.destroy()隨時隨地。正如我所說的，您可能需要將worker存儲在某個地方，例如Map，以便只有在沒有任何工作人員的情況下才會附加該腳本。

來源

2014-07-19 03:53:37 ZER0

添加點擊監聽器窗口，然後檢查event.target：

function handleClick() { 
    //try using jquery here. if $ doesnt work try window.$ 
    window.addEventListener('click', intercept, false); 
} 

function intercept(e) { 
    //try using jquery here. if $ doesnt work try window.$ or try e.target.ownerDocument.defaultView.$ 
    var elementClicked = e.target; 
    console.log('elementClicked = ', elementClicked); 
    elementClicked.style.border = '1px solid red'; 
}

來源

2014-07-15 16:44:00 Noitidart

向所有元素添加點擊事件偵聽器 - Firefox插件

回答

相關問題