Javascript Bing地图自定义信息框html上的单击事件

我一辈子都无法通过点击事件处理自定义HTML Microsoft Bing Maps信息框元素。以下代码在Bing maps以外但不在Bing maps内的任何li上触发事件：

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

有一些关于自定义HTML infobox事件的文档，但没有关于自定义HTML infobox事件的信息。他们似乎已禁用自定义信息框的所有事件。有人能证实这一点吗？他们为什么要这样做？我怎样才能避开它呢？

试试这个示例站点

不确定jquery代码段是否有效，信息框是否包含“li”

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

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>'); 

---

单击也可能不起作用，因为“LI”在信息框代码（未提供）中呈现不好。

他们的文档现在显示：

Bing Maps V8中包含InfoboxActions主要是为了向后兼容V7。相反，建议在信息框描述中使用标准HTML按钮和链接

因此，彼得斯提供的好答案可能不再是最好的解决办法。相反，我使用“onclick”属性向图钉元数据添加了自己的链接。相关代码在下面第9行

var pLoc = new Microsoft.Maps.Location(c.Latitude, c.Longitude);
var pin = new Microsoft.Maps.Pushpin(pLoc, {
    title: c.Name,
    enableHoverStyle: true
});

pin.metadata = {
    title: c.Name,
    description: c.Description + 
          '<a href="#" onclick="javascript:showDetails(' + c.Id + ');">Details</a>'
};

Microsoft.Maps.Events.addHandler(pin, 'click', function (args) {
    myInfobox.setOptions({
        location: args.target.getLocation(),
        title: args.target.metadata.title,
        description: args.target.metadata.description,
        visible: true
    });
});

---

为简单起见，我省略了有关如何构建myInfoBox以及如何将图钉添加到地图层的详细信息。

bing地图示例不包括包含HTML内容的Infobox。最接近我的是这个，没有自定义事件的文档。我添加了一个可以在HTML中运行的示例，这对您有帮助吗。如果没有，您可能必须提供完整的HTML，或者更多关于您试图实现的目标的信息。“说明”文本可点击，并显示一条消息。啊，是的，这确实有效。谢谢你知道为什么这样做，而通过jQuery设置click事件却不起作用吗？可能有几个原因：a）“li”被渲染得很糟糕/不存在。b） 你不是在等文件，准备好了。c） Bing地图不喜欢您的信息框渲染（未提供），所以我无法确定。我已经更新了答案以反映这一点。我的代码在document ready事件调用中。这种类型的jQuery事件绑定侦听的是文档而不是li元素，因此时间不应该是一个问题。此外，信息框HTML绝对有效。

var pLoc = new Microsoft.Maps.Location(c.Latitude, c.Longitude);
var pin = new Microsoft.Maps.Pushpin(pLoc, {
    title: c.Name,
    enableHoverStyle: true
});

pin.metadata = {
    title: c.Name,
    description: c.Description + 
          '<a href="#" onclick="javascript:showDetails(' + c.Id + ');">Details</a>'
};

Microsoft.Maps.Events.addHandler(pin, 'click', function (args) {
    myInfobox.setOptions({
        location: args.target.getLocation(),
        title: args.target.metadata.title,
        description: args.target.metadata.description,
        visible: true
    });
});

function showDetails(id) {
    alert(id);
}