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

Question

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

情况 ：我有一个打开模态弹出窗口的链接

<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();
}
});

警报的结果为"未定义">

我也尝试：

$(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&event.relatedTarget from bootstrap doc

：

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

提前谢谢。

Answer 1

它仅适用于您的代码。 首先检查您的 jQuery 版本与引导程序版本的兼容性。

出于参考目的，我还为工作代码提供了简单的代码更改，例如标记完成并添加了引导模式和 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();
}
});

在这里它正在工作。 泰