Bootstrap的模态框(Modal)是一个非常实用的Javascript组件。

从3.0版本开始，Modal对话框的调用元素可以通过show/shown事件中新加入的relatedTarget属性获取

“If caused by a click, the clicked element is available as the relatedTarget property of the event.”

用法如下：

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

请看下面这个例子：

模态框在显示之前会先执行alert，显示调用元素的html

Launch modal

代码如下：

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

<!-- Modal -->
<div id="myModal" class="modal fade" tabindex="-1">
 <div class="modal-dialog">
 <div class="modal-content">
 <div class="modal-header"><button class="close" type="button" data-dismiss="modal">&times;</button>
 <h4 id="myModalLabel" class="modal-title">Modal title</h4>
 </div>
 <div class="modal-body">...</div>
 <div class="modal-footer"><button class="btn btn-default" type="button" data-dismiss="modal">Close</button> <button class="btn btn-primary" type="button">Save changes</button></div>
 </div>
 <!-- /.modal-content --></div>
 <!-- /.modal-dialog --></div>
<!-- /.modal -->

本文链接：http://bookshadow.com/weblog/2014/02/20/bootstrap3-modal-invoker/
请尊重作者的劳动成果，转载请注明出处！书影博客保留对文章的所有权利。

如果您喜欢这篇博文，欢迎您捐赠书影博客： ，查看支付宝二维码