Question

我目前正在使用传单。

我试图创建一个带有可点击内容的弹出窗口。

现在我发现我可以如何在包含内容的点击事件上绑定弹出窗口：

marker.on('click', function(e){
     marker.bindPopup("<div />").openPopup();
}

我发现了如何在悬停时创建弹出窗口：

marker.on('mouseover', function(e){
    e.target.bindPopup("<div />").openPopup();

    }});        

marker.on('mouseout', function(e){  
    e.target.closePopup();

}});

现在我似乎无法做的是让弹出窗口保持打开状态，以便用户点击弹出窗口内的链接。我将不胜感激任何帮助。

Answer 1

一种方法就是http://jsfiddle.net/cxZRM/98/ 基本上它是为你的设置添加一个计时器，你只需在任意长时间过后关闭弹出窗口，以便给用户一些时间在你的div上进行交互。

marker.on('mouseover', function(e){
    e.target.bindPopup("dsdsdsdsd").openPopup();
    start = new Date().getTime();
  });        

marker.on('mouseout', function(e){  
    var end = new Date().getTime();
    var time = end - start;
    console.log('Execution time: ' + time);
    if(time > 700){
    e.target.closePopup();
    }
});

更好的方法是使用http://jsfiddle.net/AMsK9/ 确定鼠标位置并在鼠标仍在弹出窗口周围的区域内时保持弹出窗口打开。

Answer 2

我有同样的问题，我想要一个不同的弹出鼠标悬停和另一个用于点击，问题是，当我徘徊点击弹出关闭，所以我做的是添加一个标志：

var modal = true;    
function onEachFeature(feature, Polygon) 
    {
        if (feature.properties && feature.properties.popupContent && feature.properties.modal) 
        { 
            Polygon.on('mouseover', function (e) {
              Polygon.bindPopup(feature.properties.popupContent);
              this.openPopup();
              modal = false;
            });
            Polygon.on('mouseout', function (e) {

                if(!modal)
                this.closePopup();
            });
            Polygon.on('click', function (e) {
                modal = true;
                Polygon.bindPopup(feature.properties.modal).openPopup();
            });

        }
    }

如何使用可点击内容打开悬停事件的弹出窗口

2 个答案: