从引导程序4迁移到引导程序5后,模态变为灰色



我刚刚将Bootstrap 4.1重新链接到Bootstrap 5,我的模态停止工作。我的意思是,当我的模态打开时,它会变灰,我无法单击按钮或退出它。我应该如何更改它才能在Bootstrap 5中工作?

这是我的代码:

模态:

<!-- Creates the bootstrap modal where the image will appear -->
<div class="modal fade" id="imagemodal" data-backdrop="false" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Zamknij</span></button>
<h4 class="modal-title" id="myModalLabel">Podgląd</h4>
</div>
<div class="modal-body">
<!-- <img src="" id="imagepreview" style="width: 400px; height: 264px;" > -->
<img src="" id="imagepreview" style="width: 400px; height: 264px;" >
</div>
<div class="modal-footer">
<button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>

JS:

$("#pop").on("click", function() {
$('#imagepreview').attr('src', $('#imageresource').attr('src')); // here asign the image to the modal when the user click the enlarge link
$('#imagemodal').modal('show'); // imagemodal is the id attribute assigned to the bootstrap modal, then i use the show function
});

data-属性更改为data-bs-,如引导程序5中迁移更改列表中的Javascript部分所述(https://getbootstrap.com/docs/5.0/migration/)。

最新更新