javascript - 替换 Google map 中的特殊字符

Question

我正在使用 iframe 标签将 Google map 嵌入到我的网站中。由于它是挪威地址，我必须将 æ、ø、å 等字符替换为 UTF-8 十六进制代码，该代码工作正常。但有些角色我似乎无法替换。

为了重现这个问题，我有这个iframe:

<iframe id="googlemap" name="mapframe" width="425" height="350" 
            src="https://www.google.com/maps?z=11&amp;f=d&amp;output=embed&amp;language=nb&amp;q=Lille%2520Hunstad%25204A,8019%252BBOD%25C3%2598">
</iframe>

我正在使用这个 jQuery 代码来替换字符:

$(document).ready(function () {
/** REPLACE SPECIAL CHARACTERS IN GOOGLE MAPS IFRAME SRC **/
    var googleMap = $('#googlemap');
    var src;
    src = googleMap.attr('src');
    src = encodeURI(src);
    googleMap.attr('src', src);

    src.replace('æ', '%C3%A6');
    src.replace('ø', '%C3%B8');
    src.replace('å', '%C3%A5');
    src.replace('é', '%C3%A9');
    src.replace('Æ', '%C3%86');
    src.replace('Ø', '%C3%98');
    src.replace('Å', '%C3%85');
    src.replace('É', '%C3%89'); // replacing is working to here
    src.replace('%252520', '+');
    src.replace('%25252B', '+');
    src.replace('%2525', '%');
});

在这里你可以看到jsfiddle:https://jsfiddle.net/oehLcevd/9/

如果您使用开发工具检查 iframe，您可以看到 iframe 的 src 属性。

提前致谢!

Answer 1

我能够使用decodeURIComponent()规范化您的查询JavaScript 中的函数。我想知道为什么我必须调用它两次来标准化 URL 参数，但如果你现在检查 iFrame src，它会显示你所需的答案。希望有更深入了解的人能够提供一些启发。

第一个控制台输出将显示原始 URL，第二个控制台输出将显示解码后的 URL。

$(document).ready(function() {
  /** REPLACE SPECIAL CHARACTERS IN GOOGLE MAPS IFRAME SRC **/
  var googleMap = $('#googlemap');
  var src;
  src = googleMap.attr('src');
  console.log(googleMap.attr('src'));
  googleMap.attr('src', decodeURIComponent(decodeURIComponent(src)));
  console.log(googleMap.attr('src'));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Address: Lille Hunstad 4A, 8019 BODØ
<br>
<iframe id="googlemap" name="mapframe" width="425" height="350" src="https://www.google.com/maps?z=11&amp;f=d&amp;output=embed&amp;language=en&amp;q=Lille%2520Hunstad%25204A,8019%252BBOD%25C3%2598">
</iframe>