javascript - Bing map 自定义信息框 html 上的点击事件

Question

我一生都无法获得点击事件来处理自定义 HTML Microsoft Bing map 信息框元素。以下代码在 Bing map 外部但不在 Bing map 内部的任何 li 上触发该事件:

$('body').on('click', 'li', function (e) {
   console.log("target:", e.target);
});

有一些关于 attaching "actions" to basic default infoboxes 的文档但没有有关自定义 HTML 信息框事件的信息。看来他们已经禁用了自定义信息框的所有事件。谁能证实这一点吗？他们为什么要这样做？我该如何解决这个问题？

Answer 1

尝试示例网站

Examples

不确定 jquery 代码片段是否有效以及信息框是否包含“li”。

我在该 html 版本中放置了以下 JS，这将创建一个事件并生成一条消息，将其放入运行框中进行尝试:

map.entities.clear(); 
 function handlerEvent1 () 
 { 
 displayAlert('Handler1');
 } 
 function handlerEvent2 () 
  {  
 displayAlert('Handler2'); 
 } 
 function handlerEvent3 () 
{ 
 displayAlert('Handler3'); 
}
 var infoboxOptions = {width :200, height :100, showCloseButton: true, zIndex: 0, offset:new Microsoft.Maps.Point(10,0), showPointer: true}; 
 var defaultInfobox = new Microsoft.Maps.Infobox(map.getCenter(), infoboxOptions );    
 map.entities.push(defaultInfobox);
 defaultInfobox.setHtmlContent('<div id="infoboxText" style="background-color:White; border-style:solid;border-width:medium; border-color:DarkOrange; min-height:100px;width:240px;"><b id="infoboxTitle" style="position:absolute; top:10px; left:10px; width:220px;">myTitle</b><div id="infoboxDescription" style="position:absolute; top:30px; left:10px; width:220px;" onclick="handlerEvent3 ()">Description</div></div>'); 

此外，从示例代码来看，document.ready 并未等待，因此您应该将脚本放在页面底部，或者:

$( document ).ready(function() {
  $('body').on('click', 'li', function (e) {
     console.log("target:", e.target);
  });
});

由于“LI”在信息框代码中渲染得很糟糕(未提供)，点击也可能不起作用。