在jQuery for Bootstrap iframe模式中提取发件人信息

我试图在Bootstrap 4.0 Beta中以模态显示Google Map。

我发现这篇文章和代码有效，但我在jQuery中不能“流利”地用Javascript做我需要做的事情。 我也在这里看看如何找到发送者，但我无法弄明白。

假设我的声明如下：

Graceland Directions

……在我的

，我设置了基本模态…

 
  
 
 
 
 
 × 
 
  
 
 
 
 
  

我找到了这个答案，这正是我想要做的，但地址硬编码到示例中：

 // Bootstrap modal Google Map $('#google-map-modal').on('shown.bs.modal', (function() { console.log("something happened"); var mapIsAdded = false; return function() { if (!mapIsAdded) { $('.modal-body').html('
Test

'); mapIsAdded = true; } }; })()); 

 // Bootstrap modal Google Map $('#google-map-modal').on('shown.bs.modal', (function() { console.log("something happened"); var mapIsAdded = false; return function() { if (!mapIsAdded) { $('.modal-body').html('
Test

'); mapIsAdded = true; } }; })()); 

                
  
The King!
 
Here are directions to Graceland.
  Graceland Directions  <!--  --> 
 
  
 
 
 
 
 × 
 
  
 
 
 
 
 
   

我如何更新jQuery以获取发件人的data-source属性和按钮的标题？

Answer 1

也许通过使用event.relatedTarget ？

  $('#your-modal').on('show.bs.modal', function (e) { var $invoker = $(e.relatedTarget); }); 

OP更新：

这段代码让我超越了终点线：

 $('#google-map-modal').on('show.bs.modal', function (event) { var button = $(event.relatedTarget) // Button that triggered the modal var locationName = button.text(); var locationUrl = button.attr('data-source'); var modal = $(this) modal.find('.modal-title').text(locationName); modal.find('.modal-body').html(''); })