尝试从 javascript 更改 iframe 位置

Question

我有很多商店每个商店都有纬度，当我点击任何商店的位置图标时我将纬度，经度发送到javascript函数并在js函数中更改iframe src并且我显示显示iframe的模型但是此处未显示位置的 iframe 是代码。

iframe 错误 www.google.com 拒绝连接。

图标按钮 <a onclick="getLocation({{$store->lat}},{{$store->lon}})" data-toggle="modal" href="#edit_location"><i style="font-size: 25px; color: #009688;" class="fas fa-location-arrow"></i></a>

模型中的 iframe

<div class="mapouter mt-3"><div class="gmap_canvas"><iframe  id="gmap_canvas" src="" frameborder="0" scrolling="no" style="width: 100%; height: 400px;"></iframe><a href="https://fnftest.net" style="display:none">fnf test playground remake</a><style>.mapouter{position:relative;text-align:right;height:400px;width:100%;}</style><a href="https://www.googlemapsiframegenerator.com" style="display:none">Google Maps Iframe Generator - Free Html Embed Code</a><style>.gmap_canvas{overflow:hidden;background:none!important;height:400px;width:100%;}</style></div></div>

javascript函数

function getLocation(lat,lon){
    var loc = document.getElementById('gmap_canvas');
    loc.src = 'https://maps.google.com/maps?q=' + lat + ',' + lon + '&hl=es;z=14&amp;output=embed';
}

备注当我在没有 js 的情况下给 iframe src 任何静态位置时，当我从 js 更改 src 时出现问题，错误显示

Answer 1

您的 JS 函数位于何处 - 我假设它在外部脚本资源中，而不是直接包含在内部 HTML 文档中？

loc.src = 'https://maps.google.com/maps?q=' + lat + ',' + lon + '&hl=es;z=14&amp;output=embed';

然后用单个 & 替换 &。仅当上下文为 HTML 时才需要将其编码为 & - 但如果此代码驻留在外部 JS 资源中，则情况并非如此。

当我尝试将此 URL 与 & 一起使用时，

Google 确实给了我“连接被拒绝”消息（更准确地说，浏览器说它有 X-Frame-Options设置为 Deny)，但仅 &.

似乎工作正常

尝试从 javascript 更改 iframe 位置

trying to change iframe location from javascript

javascript

php

html

laravel

iframe