-1

问题：当尝试在 Google Maps infoWindow 中的选择器上触发 jQuery 事件时，捕获 gmap 对象中的事件所需的点击事件侦听器必须是其他点击函数的父级，导致点击事件在第一次点击时触发失败.

我在 StackOverflow 上找到的所有解决方案都显示了如何添加 eventListener，但仍然没有考虑到第一次点击时无法触发的问题。

如果您使用 jQuery UI Maps 填充打开 infoWindows 的可点击标记，并且希望能够针对主（父）页面上的 jQuery 事件定位 infoWindow 内的元素，则下面的解决方案将起作用。

此解决方案解决了嵌套单击函数导致的典型第一次触发问题，其中 jQuery 事件不会在第一次单击时触发，因为您的函数必须在 $('map_canvas').gmap() 的 addEventListener 中才能被捕获 -但是，当然，它们会嵌套在另一个点击函数中，因此在第二次点击之前不会触发。

肯定有更多标准和/或雄辩的方法来实现这一点，但除了需要稍微不典型的语法外，这解决了所有问题，并为原本非常令人沮丧的问题提供了一个非常快速、直接、可行的解决方案，为您节省了 8 + 我花了几个小时猛敲墙头才制作出来。

4

1 回答 1

0

解决方案：

使用 $('#map_canvas').gmap() 上的 click 事件监听器作为一个包罗万象的方法，使用 mainevent 函数来确定被点击对象的类名，然后使用 if 语句查看它是否与我们希望在 infoWindow 中使用的任何“选择器”匹配，并从那里执行常规功能。

为方便起见，jQuery(element) 被指定为与普通的 jQuery(this) 等效

类被拆分为一个数组，以说明单击对象上的多个类。

然后我们只需使用 if 语句来检查我们希望用作选择器的类是否在被单击对象的类名数组中，如果是，则放入我们通常会放入的 jQuery 中选择器的嵌套单击功能，只需在必要时将 (element) 替换为 (this)。

这可以很容易地适应使用 id 作为选择器而不是类 - 只需将 $(element).attr('class') 更改为 $(element).attr('id')

这是示例代码：

jQuery('#map_canvas').gmap().addEventListener('click', function(mainevent) {

    // We cannot directly target elements inside the Google map and infoWindows with jQuery, so here we catch all clicks on the map and then use if statements to see if the clicked element matches any of the selectors we wish to use.

    var element = jQuery(mainevent.target);
    if ( $(element).attr('class') ) { var MainEventClassList = $(element).attr('class').split(' '); }

    // Gets the classes of the clicked element into an array, so we can check for matches with if statements, as an equivalent to typical jQuery class selectors.  We have also made (element) available as a replacement for (this).



    if ( jQuery.inArray( 'SelectorClassName', MainEventClassList ) >= 0 ) {

        mainevent.preventDefault();
        mainevent.stopPropagation();
        var destinationid = jQuery(element).attr('href');
        alert(destinationid);

    }


});
于 2015-06-19T02:43:11.937 回答