Question

我看到很多主题，但我仍然没有答案。

情况：我有一个打开模态popin的链接

<a class="pointer" data-filtre='non' data-toggle="modal" data-target="#myModalAnnexeDe" >
<a class="pointer" data-filtre="oui" data-toggle="modal" data-target="#myModalAnnexeDe" >

我有我的js

$('#myModalAnnexeDe').on('show.bs.modal', function (event) {
     var filtre=$(event.relatedTarget).attr('data-filtre');
     alert($(event.relatedTarget).attr("data-filtre"));
     if(filtre == 'oui'){
         $('.notform').hide();
     }
});

警报的

结果未定义＆＃39;

我也试试：

$(event.relatedTarget).attr('data-filtre')
$(event.relatedTarget).data('filtre')
$(event.relatedTarget).data($('a'),'filtre')
$(event.relatedTarget).data(a,'filtre')
$(event.relatedTarget).attr(filtre)
$(event.relatedTarget).attr('filtre')
$(event.relatedTarget).dataset.filtre
$(this).attr("data-filtre")
...

也许还有很多人......

关于show.bs.modal＆amp;来自bootstrap doc的event.relatedTarget：

show.bs.modal 调用show实例方法时会立即触发此事件。如果由点击引起，则单击的元素为可用作事件的relatedTarget属性。

提前谢谢。

Answer 1

它只适用于您的代码。首先检查你的jQuery版本与bootstrap版本的兼容性。

为了参考目的，我还提供了代码中的简单更改的工作代码，如标记完成和添加的bootstrap模式和jquery链接。

$('#myModalAnnexeDe').on('show.bs.modal', function (event) {
     var filtre=$(event.relatedTarget).attr('data-filtre');
     alert($(event.relatedTarget).attr("data-filtre"));
     if(filtre == 'oui'){
         $('.notform').hide();
     }
});

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<a class="pointer" data-filtre='non' data-toggle="modal" data-target="#myModalAnnexeDe">non</a>
<a class="pointer" data-filtre="oui" data-toggle="modal" data-target="#myModalAnnexeDe">oui</a>

<!-- Modal -->
<div id="myModalAnnexeDe" class="modal fade" role="dialog">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Modal Header</h4>
      </div>
      <div class="modal-body">
        <p>Some text in the modal.</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>
</div>

Answer 2

我再次尝试了很多事情，仍然无法使用show.bs.modal事件。

所以我刚刚做了

$('.lienfiltre').on('click', function (){
  if($(this).attr('data-filtre') === 'oui'){
     $('.notform').hide();
  }
});

在这里它正在发挥作用。 TY

获取引导模态链接的数据属性

2 个答案: