Question

我知道这个主题已经得到了解决，但是我想提出自己的解决方案而且我不明白为什么它不起作用。任何建议将不胜感激。

HTML：

    <section class="map" id="map">
    <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d640.0242065261922!2d14.422763000000002!3d50.084474!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x470b94ec3c31c091%3A0x9ad699d70874bab9!2sAteli%C3%A9r+Triton!5e0!3m2!1scs!2scz!4v1427795367306" width="100%" height="500" frameborder="0" class="no-interact" style="border:0"></iframe>

CSS：

 .no-interact {
    pointer-events: none;
 }

jQuery的：

$(document).ready(function(){
    $("#map").click(function(){
       $("#map").removeClass("no-interact");
    });

    $("#map").mouseleave(function(){
      $("#map").addClass("no-interact");
    });
});

CSS类正常工作并禁用滚动嵌入在网页上的地图。但是当我点击它时，没有任何反应。 jquery代码有问题吗？

Answer 1

谷歌地图有自己的点击事件处理程序。尝试使用Google Maps JavaScript API代替iframe，它具有自定义事件绑定的api。 https://developers.google.com/maps/documentation/javascript/reference#MapsEventListener

谷歌地图 - jquery切换滑动

1 个答案: