当浏览器未对焦时,jVectorMap onRegionClick在Chrome中首次点击时不会触发

Question

标题几乎说明了这一点,因为这个错误只发生在Chrome(最新版本)中.

当使用Chrome时,它当前没有焦点,在使用两个显示器,然后单击Chrome中页面上加载的jVectorMap组件的某个区域时,只有当浏览器获得焦点时,才会触发单击,在这种情况下通过第一次单击,第二次单击区域会触发onRegionClick事件.

有谁知道这是一个已知的Chrome错误还是导致问题的jVectorMap组件？

如果是这样,是否有解决方法？

*编辑:即使Chrome没有焦点,您也会注意到组件的onRegionOver事件有效.

这是一个jsFiddle的行动 - http://jsfiddle.net/fFTzL/

---

我正在发布jVectorMap的初始化,但是可以在jsFiddle中看到其他代码.

    $map = $('.map');
    var map = new jvm.WorldMap({
        map: 'world_mill_en',
        container: $map,
        normalizeFunction: 'polynomial',
        zoomButtons: false,
        zoomOnScroll: false,
        hoverOpacity: 1,
        hoverColor: false,
        backgroundColor: '#fff',
        regionStyle: {
            initial: {
                fill: '#cdcccc',
                    "fill-opacity": 1,
                stroke: 'white',
                    "stroke-width": 0,
                    "stroke-opacity": 1
            },
            hover: {
                "fill-opacity": 1
            },
            selected: {
                fill: '#6eab24'
            }
        },
        series: {
            regions: [{
                attribute: 'fill'
            }]
        },
        regionsSelectable: true,
        regionsSelectableOne: true,
        onRegionLabelShow: function (event, label, code) {
            code = code.toLowerCase();
            var content = regionCheck(code, "region");
            if (content) {
                label.css('left', -200);
                $("path", $(this)).css("cursor", "pointer");
            } else {
                event.preventDefault();
                label.text("");
                $("path", $(this)).css("cursor", "default");
            }
        },
        onRegionOver: function (event, code) {
            map.clearSelectedRegions();
            code = code.toLowerCase();
            var content = regionCheck(code);
            if (content) {
                regionCode = code;
                map.setSelectedRegions([code.toUpperCase()]);
            }
        },
        onRegionOut: function (event, code) {
            map.clearSelectedRegions();
            code = code.toLowerCase();
            var content = regionCheck(code);
            if (content) {
                map.setSelectedRegions([code.toUpperCase()]);
            } else {
                return false;
            }
            regionCode = '';
        },
        onRegionClick: function (event, code) {
            alert("Country clicked");
        }
    });
    map.series.regions[0].setValues(colors);

Answer 1

我们可以使用类似的东西:

$map.on('click', function(e){
  if (~e.target.className.baseVal.indexOf('jvectormap-region')) {
    ..
  }
});