分类导航

jQuery 发布时间：2022-03-30 发布网站：大佬教程 code.js-code.com

大佬教程收集整理的这篇文章主要介绍了jquery – 如何查找bootstrap-modal对话框的源代码，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

我正在使用twitter bootstrap模式和 jquery.

当有多个按钮可以创建模态对话框时,如何找到源按钮？

在bootstrap-modal之前,我使用onclick来显示确认消息,比如,onclick =“newGame(3,truE)”;现在我想用bootstrap-modal来做.

HTML,

<button type="button" class="btn" id="ctrl6" data-controls-modal="my-modal" data- 
BACkdrop="static">3</button>
<button type="button" class="btn" id="ctrl7" data-controls-modal="my-modal" data-
BACkdrop="static">4</button>
<button type="button" class="btn" id="ctrl8" data-controls-modal="my-modal" data- 
BACkdrop="static">5</button>

<div id="my-modal" class="modal hide fade in" style="display: none;">
...
</div>

JS,

$(document).ready(function() {
      // Hide modal if "Go BACk" is pressed
      $('#my-modal .go-BACk-button').click(function() {
        $('#my-modal').modal('hide');
      });

      // Hide modal if "Okay" is pressed
      $('#my-modal .okay-button').click(function() {
        $('#my-modal').modal('hide');
      });
  });

谢谢.

解决方法

您@R_160_9381@最近的拉取请求很有用： Allow passing data arguments to modal

此提交@L_867_4@modal插件,以便它抓取触发元素上的所有数据属性.通过在所有触发元素中添加唯一标识符,假设data-user =“some_uid”,可以在将来从模态对象中检索数据.

例如,如果使用示例中的按钮：

<button data-user="4" ... >
<button data-user="5" ... >
<button data-user="6" ... >

在回调中,您可以访问该信息：

// Hide modal if "Okay" is pressed
$('#my-modal').on('click','.okay-button',function(E) {
  var modal = $(e.delegateTarget).data('modal');

  console.log('OriginaTing element user: ' + modal.optionS.User);

  modal.hide();
});