html 单击链接后,是否可以关闭Bootstrap模态?

ie3xauqp  于 2022-12-02  发布在  Bootstrap
关注(0)|答案(7)|浏览(166)

现在,我在Bootstrap模态中使用这个来重定向到一个站点:

<a href="http://www.example.com/" href="_blank">click</a>

我希望在单击链接后关闭模态,因此我认为将data-dismiss="modal"添加到标记中是可行的,但是这会导致模态在链接未打开的情况下关闭。
我可以合并这些并使模态关闭 * 后 * URL打开?

t1qtbnec

t1qtbnec1#

这对我很有效,不需要额外的脚本标记:

<a href="http://www.example.com/" onclick="$('#myModal').modal('hide')">click</a>
6kkfgxo0

6kkfgxo02#

在自举4:

<a href="http://www.example.com/" data-dismiss="modal" target="_blank">click</a>
nwwlzxa7

nwwlzxa73#

添加一个id到锚标记。然后,你可以使用该id关闭模态一旦它被点击。

<a href="http://www.example.com/" href="_blank" id="sample">click</a>

<script>        
    $("a#sample").click(function(){
    $('#myModal').modal('hide')
    });
</script>
e7arh2l6

e7arh2l64#

这对我很有效。

cidc1ykv

cidc1ykv5#

下面的代码应该可以做到这一点

$('a').click(function(){
  $('modal-selector').modal('hide')
})
wf82jlnq

wf82jlnq6#

您可以在项目中使用已经存在的类别:

class="modal-close"
gcuhipw9

gcuhipw97#

我把这段代码添加到整个项目中

$(document).on('click', '.modal-hide-continue', function (e){
    $(this).closest('.modal').modal('hide');
});

并且它会自动作用于模态中类名为modal-hide-continue的任何元素。

相关问题