如何從網頁調用Firefox擴展中定義的JS函數？

Question

我知道有人在這里提出要求，但對我來說不起作用。 我正在從擴展程序的JS文件中注入以下html。 在同一文件中，我定義了closepop（），該事件應該在onClick事件中執行，但是當我單擊時，它並沒有執行。

function openpop(obj){var refPopUpDiv = obj.getElementById('popUpDiv');refPopUpDiv.style.display = 'block';}
document.addEventListener("MY_EVENT", closepop, false, true);
function closepop()
{
    alert("Hurray from page")
}
var myExtension = {
    init: function() {
        // The event can be DOMContentLoaded, pageshow, pagehide, load or unload.
        if(gBrowser) gBrowser.addEventListener("DOMContentLoaded", this.onPageLoad, false);
    },
    onPageLoad: function(aEvent) {
        var doc = aEvent.originalTarget; // doc is document that triggered the event
        win = doc.defaultView; // win is the window for the doc
        var head = doc.getElementsByTagName("head")[0];
        if(typeof doc !="undefined" && typeof head !="undefined")
        {
            addStyleSheet(head,doc,"picker.css");
        }
       // win.wrappedJSObject.testFunction();
        var style = doc.getElementById("link_picker");
        if(!style)
        {
            //alert("create");
        }
       //fire only when loaded
       if(doc.nodeName == "#document")
       {

           if(doc.location.href.indexOf("facebook.com") == -1) 
            {
                return;
            }
            if($(doc).find("#blueBar"))
            {
                var blue_bar =  $(doc).find("#blueBar");

                var themeURL1 = "theme1.css";
                var themeURL2 = "theme2.css";
                var themeURL3 = "theme3.css";
                var themeURL4 = "theme4.css";
                var themeURL5 = "theme5.css";
                var themeURL6  = "theme6.css";

                if(typeof blue_bar.html()!="undefined")
                {
                    var blueBarHtml = blue_bar.html();
                    var model1 = "http://oi43.tinypic.com/20ewx.jpg";
                    var model2 = "http://oi43.tinypic.com/20kc56x.jpg";
                    var model3 = "http://oi43.tinypic.com/3ec56x.jpg";
                    var model4 = "http://oi43.tinypic.com/ess.jpg";
                    var model5 = "http://oi43.tinypic.com/xx.jpg";
                    var model6 = "http://oi43.tinypic.com/210xx4526x.jpg";

                    var theme1text = "My Lovely ew";
                    var theme2text = "My Lovely Moewbile2";
                    var theme3text = "My Lovely Mobile3";
                    var theme4text = "My Lovely Mobile4";
                    var theme5text = "My Lovely Mobile5";
                    var theme6text = "My Lovely Mobile6";
                    //Propmo Text
                    var promoLeft = "All My Mumbo JOb Goes here.All My Mumbo JOb Goes here.All My Mumbo JOb Goes here.All My Mumbo JOb Goes here.All My Mumbo JOb Goes here.All My Mumbo JOb Goes here.All My Mumbo JOb Goes here.";
                    var promoRight = "All My Mumbo JOb Goes here.All My Mumbo JOb Goes here.All My Mumbo JOb Goes here.All My Mumbo JOb Goes here.All My Mumbo JOb Goes here.All My Mumbo JOb Goes here.All My Mumbo JOb Goes here.";
                    var popUpDiv = "<div id ='popUpDiv' class='popUpDiv'><div class=close><a onclick='closepop();' title=Close href=#>X</a></div><div class=clearfix></div><div id=promoLeft>"+promoLeft+"</div><div id=modelContainer><a onclick='setTheme(\""+themeURL1+"\")' title='"+theme1text+"' href=#><img class=model src='"+model1+"' /></a><a onclick='setTheme(\""+themeURL2+"\")' title='"+theme2text+"' href=#><img class=model src='"+model2+"' /></a><a onclick='setTheme(\""+themeURL3+"\")' title='"+theme3text+"' href=#><img class=model src='"+model3+"' /></a><a onclick='setTheme(\""+themeURL4+"\")' title='"+theme4text+"' href=#><img class=model src='"+model4+"' /></a><a onclick='setTheme(\""+themeURL5+"\")' title='"+theme5text+"' href=#><img class=model src='"+model5+"' /></a><a onclick='setTheme(\""+themeURL6+"\")' title='"+theme6text+"' href=#><img class=model src='"+model6+"' /></a></div><div id=promoRight>"+promoRight+"</div><div id=save><input onclick='saveChanges();' type=button value='Save and Close' /></div></div>";
                    blue_bar.html(popUpDiv+blueBarHtml);
                }
            }
       }                                   
    }
}
window.addEventListener("load", function load(event){
    window.removeEventListener("load", load, false); //remove listener, no longer needed
    myExtension.init();  
},false);

//Add Style Sheet

function addStyleSheet(head,doc,file)
{
     var path = "chrome://xxx/content/"+file;
     var headHTML = "";
     if(head.innerHTML!="" && head.innerHTML!= null)
     {
        // alert();
         headHTML = head.innerHTML;
         var css1 = '<link id = "css_link0" id= type=text/css rel=stylesheet href='+path+'>';
         var js = '<script id=cust_evt>var evt = document.createEvent("Events");evt.initEvent("MY_EVENT", true, false);document.dispatchEvent(evt);</script>';
         head.innerHTML = headHTML+css1+js;
     }
}

Answer 1

document.addEventListener("MY_EVENT", closepop, false, true);

您的closepop事件是在“ MY_EVENT”上調用的，而不是單擊，由addStyleSheet從頁面加載中調度。