0

我正在尝试将 enyo 与传单结合使用。我试图在传单弹出窗口中放置一个传单按钮，但是 ontap 回调永远不会触发。下面我包含了实例化按钮的代码。关于我可能做错了什么的任何想法？我有一种感觉，我可能没有正确实例化按钮。

顺便说一句，传单弹出窗口阻止了单击事件传播的问题，但此后该问题已得到解决。

编辑：这是更完整的代码，以及 jsFiddle 的链接：http: //jsfiddle.net/pwnosaurus/YPqpm/

enyo.kind({
    name: "mapContainer",
    rendered: function(){
        this.inherited(arguments);

        //Initialize the map
        this.map = L.map(this.id).setView([44.981313, -93.266569],13);
        L.tileLayer("http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
            {attribution: "Map data © OpenStreetMap contributors"}
        ).addTo(this.map);

        //Initilize the marker and popup
        var mark = new L.marker([44.981014, -93.270520]).addTo(this.map);
        var popDiv = L.DomUtil.create("div");
        var pop = new L.popup();
        mark.bindPopup(pop);

        //Initilize the enyo button and control
        var ctrl = new enyo.Control({
            myHandler: function(){
                alert("The foo button was tapped");
            }
        });
        var button = new enyo.Button({
            name: "thefoobutton",
            content: "foo",
            ontap: "myHandler",
            owner: ctrl,
        });

        button.renderInto(popDiv);
        pop.setContent(popDiv);
    },

});
mapCont = new mapContainer();
mapCont.renderInto(document.body);
4

2 回答 2

0

我的猜测是你不是 Enyo 类型，所以你不想设置所有者。如果不是这样，您能否提供更多有关此代码所在位置的上下文？

于 2013-06-28T14:45:25.020 回答
0

我已经实现了一种解决方法，它在传单弹出窗口上放置一个点击处理程序，它直接在按钮上冒泡一个 ontap 事件。

下面的代码，并在此处执行 http://jsfiddle.net/pwnosaurus/uqcJJ/4/

enyo.kind({
    name: "mapContainer",
    rendered: function(){
        this.inherited(arguments);

        //Initialize the map
        this.map = L.map(this.id).setView([44.981313, -93.266569],13);
        L.tileLayer("http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
            {attribution: "Map data © OpenStreetMap contributors"}
        ).addTo(this.map);

        //Initilize the marker and popup
        var mark = new L.marker([44.981014, -93.270520]).addTo(this.map);
        var popDiv = L.DomUtil.create("div");
        var pop = new L.popup();
        mark.bindPopup(pop);

        //Initilize the enyo button and control
        var ctrl = new enyo.Control({
            myHandler: function(){
                alert("The foo button was tapped");
            }
        });
        var button = new enyo.Button({
            name: "thefoobutton",
            content: "foo",
            ontap: "myHandler",
            owner: ctrl,
        });

        //Add click handler
        //inspired by https://github.com/NBTSolutions/Leaflet/commit/466c0e3507cf0934a9d1441af151df2324a4537b#L2R129
        function forward(e){
            if (window.enyo && window.enyo.$ && e.srcElement && e.srcElement.id && window.enyo.$[e.srcElement.id]){
                    window.enyo.$[e.srcElement.id].bubble("ontap", e);
            }
        }
        this.map.on("popupopen", function (e){
            if (! e.popup.hasForwarder){ //Note: this check may not be needed. The L.DomEvent.on() seems to handle multiple adds of named functions
                L.DomEvent.on(pop._contentNode, "click", forward, this);
                e.popup.hasForwarder = true;
            }
        }, this);


        button.renderInto(popDiv);
        pop.setContent(popDiv);
        mark.openPopup();
    },

});
mapCont = new mapContainer();
mapCont.renderInto(document.body);
于 2013-06-28T18:28:01.940 回答