为什么 FramedCloud 弹出窗口会夺取弹出窗口中的点击事件?
current_popup = new OpenLayers.Popup.FramedCloud(
"featurePopup",
f.geometry.getBounds().getCenterLonLat(),
new OpenLayers.Size(0,0),
"<b>Наблюдения</b><br/>" + $.map(features, function(fe) { return fe.attributes.description; }).join('<br/>'),
null, false, null);
map.addPopup(current_popup, true);
$('#map').on('click', function() { console.log('test'); return false; });
除了当我点击弹出窗口内的链接时,它总是捕获点击事件。弹出窗口和锚点都是 #map
的后代。
- 点击地图 => 回调被触发
- 点击标记 => 回调被触发,弹出窗口被显示
- 在弹出窗口内部点击(不是链接)=> 回调不会被触发
- 点击弹出窗口内的链接 => 同样地,什么也不会发生
OL 中的这部分代码相当晦涩难懂。
为什么它会捕获弹出窗口内的点击?如何撤消此行为?
编辑:深入调试 OL:此函数被触发:
bindAsEventListener: function(func, object) {
return function(event) {
return func.call(object, event || window.event);
};
event.target
是锚点,正是我所期望的:
<a class="edit-card-link" href="/form/?id=806">...</a>
func
is:
handleBrowserEvent: function(evt) {
var type = evt.type, listeners = this.listeners[type];
if (!listeners || listeners.length == 0) {
return;
}
var touches = evt.touches;
if (touches && touches[0]) {
var x = 0;
var y = 0;
var num = touches.length;
var touch;
for (var i = 0; i < num; ++i) {
touch = touches[i];
x += touch.clientX;
y += touch.clientY;
}
evt.clientX = x / num;
evt.clientY = y / num;
}
if (this.includeXY) {
evt.xy = this.getMousePosition(evt);
}
this.triggerEvent(type, evt);
}
this
是 OpenLayers.Event 类的实例,evt.target
仍然是那个锚点,listeners
包含一个监听器:
function (evt){OpenLayers.Event.stop(evt,true);}
这是原因吗?我该如何将其移除?
pointer-events
在 IE 中不被支持:http://css-tricks.com/almanac/properties/p/pointer-events/ - colllin