我遇到的问题是,在 MS Edge 中,我的图像映射功能只能部分工作。它由淘汰赛 FW 提供动力。在更大的图像映射上,它不会将整个图像映射注册到视图模型中。因此,图像映射的所有悬停效果和单击样式都会停止工作。
然而,这只是大图像地图的问题,还值得注意的是,注册的部分确实触发了单击功能(只是没有样式)。
最显着的问题是我无法调试它,如果我进入调试控制台并刷新页面,它确实可以工作。
这是用 Razor 渲染的图像映射代码:
<div id="seatplan" data-bind="visible:maximumReached">
<img id="mapSeatPlan" src="@Url.Action("MyImage", "Show", new { uid = Model.Show.RowGuid })" alt="seatplan" usemap="#plan_met" />
<map name="plan_met" id="plan_met">
@foreach (var seat in seats)
{
<area shape="rect" href="#" data-seat="@seat.RowGuid" coords="@seat.CoordX,@seat.CoordY,@(seat.CoordX + seat.CoordWidth),@(seat.CoordY + seat.CoordHeight)" alt="@seat.RowName @seat.DisplayName" />
}
</map></div>
这是将区域注册到数组中的 JS:
function buildAreas() {
var items = $('#plan_met').find('area');
var areaArray = [];
items.each(function () {
var areaName = $(this).attr('data-seat');
var fullName = $(this).attr('alt');
var newarea = {
key: areaName,
toolTip: buildToolTipArea(areaName, fullName)
};
if (isSelected(areaName)) newarea.selected = true;
areaArray.push(newarea);
});
return areaArray;
}
该代码确实在除 Edge 之外的每个浏览器上按预期工作,并且如果开发工具打开,则在 Edge 中也按预期工作。使用开发工具解锁的 Chakra 引擎中是否存在可能破坏 JS 的限制?
如果是,我怎样才能让它工作?
更新 :https://bitbucket.org/dampeebvba/issue-1303/src https://bitbucket.org/dampeebvba/issue-1303/src我已经在没有淘汰的情况下重现了这个问题,因为 imagemapper 插件,我不得不使用 Jquery。我想再次强调,它适用于包括 Internet Explorer 在内的所有浏览器,并且可以在 Edge 中使用,但前提是您在打开开发工具的情况下刷新页面。而且边缘的单击功能将一直工作到 140 年代的某个地方。