我希望在点击特定链接时显示模式,然后在隐藏时我想要打开它的点击属性。以下代码在第一次单击时完美运行,但之后它还返回先前单击的属性。
$('body').on('click',function(e) {
var $target= e.target;
$('#my_modal').modal('show');
$('#my_modal').on('hidden.bs.modal', function (e) {
alert($target.getAttribute('data-my-id'));
})
});
Here is the fiddle demonstrating this.
如何才返回当前点击事件?
答案 0 :(得分:2)
更改$('#my_modal').on('hidden.bs.modal', function (e) {
到$('#my_modal').one('hidden.bs.modal', function (e) {
(即ONE而不是ON)。
这将在处理程序运行后取消绑定,这样每当click事件创建新的处理程序时,过去的处理程序将不再存在以进行额外的函数调用。 http://api.jquery.com/one/
答案 1 :(得分:0)
您还可以尝试将属性值添加到模态,并在模态关闭事件上显示时使用它。请参阅以下代码
<a href="#" class="btnlink" data-my-id="101"> Link 101</a><br/>
<a href="#" class="btnlink" data-my-id="102"> Link 102</a><br/>
<a href="#" class="btnlink" data-my-id="103"> Link 103</a><br/>
<!-- modals -->
<div id="my_modal" class="modal fade" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title">Test Me</h4>
</di class="btnlink" v>
<div class="modal-body" id="linkval" data-attr="">
<p>
This is only a test.
</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">OK</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
$('.btnlink').on('click',function(e) {
var $target= e.target;
$('#my_modal').modal('show');
$('#linkval').attr('data-attr',$target.getAttribute('data-my-id'));
});
$('#my_modal').on('hidden.bs.modal', function (e) {
alert($('#linkval').attr('data-attr'));
$('#linkval').attr('data-attr','');
});