Javascript 将数据id传递给引导模式并在框架url中使用
我试图在引导模式下显示地图。我有包含位置链接的记录列表。单击其位置将在模式窗口中显示地图位置。我成功地将该值传递到模式窗口。但无法在iframe src链接中使用。下面是我的代码Javascript 将数据id传递给引导模式并在框架url中使用,javascript,jquery,html,iframe,bootstrap-modal,Javascript,Jquery,Html,Iframe,Bootstrap Modal,我试图在引导模式下显示地图。我有包含位置链接的记录列表。单击其位置将在模式窗口中显示地图位置。我成功地将该值传递到模式窗口。但无法在iframe src链接中使用。下面是我的代码 <a href="#myMapModal" class="btn fblack" data-toggle="modal" data-id="<?=$row['lat']?>,<?=$row['lng']?>">Location on Map</a> 还有我的jque
<a href="#myMapModal" class="btn fblack" data-toggle="modal" data-id="<?=$row['lat']?>,<?=$row['lng']?>">Location on Map</a>
还有我的jquery
<script>
$('#myMapModal').on('show.bs.modal', function (e) {
var location = $(e.relatedTarget).attr('data-id');
$(this).find('#latlng').text(location);
});
</script>
$('#myMapModal').on('show.bs.modal',function(e){
变量位置=$(e.relatedTarget).attr('data-id');
$(this).find(“#latlng”).text(位置);
});
我正在尝试将返回值放入url中
<iframe width="570" height="300" frameborder="0" style="border:0;" src="https://www.google.com/maps/embed/v1/place?q=#latlng&key=xxxxxxxxxxx"></iframe>
我给出了q=#latlng
我可以使用
但是我无法在URL中使用。使用此脚本,了解有关google api的更多信息
<script>
$(function(){
$('#myMapModal').$('.bs-example-modal-lg').on('show.bs.modal', function (e) {
var location = $(e.relatedTarget).attr('data-id');
var newUrl = 'https://www.google.com/maps/embed/v1/view?key=1234¢er='+location;
console.log(newUrl);
$(this).find('iframe').attr('src',newUrl);
});
});
</script>
$(函数(){
$('#myMapModal').$('.bs示例模态lg').on('show.bs.modal',函数(e){
变量位置=$(e.relatedTarget).attr('data-id');
var newUrl=https://www.google.com/maps/embed/v1/view?key=1234¢er=“+位置;
console.log(newUrl);
$(this.find('iframe').attr('src',newUrl);
});
});
我做了什么使它工作
<script>
$('#myMapModal').on('show.bs.modal', function (e) {
var location = $(e.relatedTarget).attr('data-id');
$.ajax({
type : 'post',
url : 'map-list.php', //Here you will fetch records
data : 'rowid='+ location, //Pass $id
success : function(data){
$('#fetched-data').html(data);//Show fetched data from database
}
});
});
</script>
$('#myMapModal').on('show.bs.modal',function(e){
变量位置=$(e.relatedTarget).attr('data-id');
$.ajax({
键入:“post”,
url:'map list.php',//您将在这里获取记录
数据:“rowid=”+位置,//传递$id
成功:功能(数据){
$(“#获取的数据”).html(数据);//显示从数据库获取的数据
}
});
});
关于map-list.php
<?php
//Include database connection
if($_POST['rowid']) {
$eveid = $_POST['rowid']; //escape string
?>
<iframe width="570" height="300" frameborder="0" style="border:0;" src="https://www.google.com/maps/embed/v1/place?q=<?=$eveid?>&key=AIzaSyCoqMKgHRLWPQAwjGq0dzRhSg6e4UlrgE4"></iframe>
<?
}
?>
你这是什么意思?对不起,我是jquery新手,我不知道如何使用它。在问题中的上述代码中,我是否需要使用iframe执行任何操作。
<div id="fetched-data"></div>