Question

我使用以下代码为地图中的标记创建信息窗口。在消息变量中，我发送一个带有Html的字符串。当我在信息框内运行我的应用程序时，我得到的字符串没有Html样式。例如，在盒子里面，我看到等等等等......有谁知道如何在内部使用html样式获取信息框？

 function attachSecretMessage(marker, number) {

         var infowindow  = new google.maps.InfoWindow(
      { content: message[number],
          size: new google.maps.Size(50, 50)
      });
            google.maps.event.addListener(marker, 'click', function() {
                infowindow.open(map1, marker);
      });

Answer 1

将所有自定义html代码放入变量中，并将值指定给“content”!!!

    var contentString = 
                '<div id="content" style="width:400px; background-color:red;">' +
                'My Text comes here' + 
                '</div>';

   var infowindow = new google.maps.InfoWindow({
            content: contentString,
            maxWidth: 400
        });

Answer 2

而不是infoWindow尝试infoBox这可以风格化

Answer 3

在地图中显示用户提交的地址是很常见的，所以在这里要小心 XSS 攻击。这是我公司的安全审计员发现的漏洞之一。

有人很容易提交这样的地址：

<img src onerror=alert('hello, I'm hacking you!') />

尽管像 React 这样的一些框架可以保护您免受一般框架的侵害，但这些 3rd 方库可能不会！

InfoWindow在谷歌地图中使用Html

3 个答案: