我有示例页面和引导对话框是从服务器返回。我想把它放在DIV里面。
一旦点击，它会给我这个错误：
未捕获的类型错误：myModal.addEventListener不是函数
在这一行：
myModal.addEventListener('show.bs.modal', function () {为什么？谢谢！
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" type="text/css" />
</head>
<body>
<p><a href="#" onclick="showSubscriptionInfo();">Open dialog</p>
<div id="myDiv"></div>
</body>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
<script>
function showSubscriptionInfo(){
var data = ''+
'<div class="modal fade" id="subsModal" tabindex="-1" aria-labelledby="exampleModalLabel">'+
' <div class="modal-dialog">'+
' <div class="modal-content" style="height:450px">'+
' <div class="modal-body">'+
'<p>xxx</p>'+
' </div>'+
'<div class="modal-footer">'+
' <button type="button" class="button" data-bs-dismiss="modal">Close</button>'+
'</div> '+
' </div>'+
' </div>'+
'</div>';
document.getElementById('myDiv').innerHTML = data;
var myModal = new bootstrap.Modal(document.getElementById('subsModal'));
myModal.show();
myModal.addEventListener('show.bs.modal', function () {
alert(1);
}, { once: true });
myModal.addEventListener('hide.bs.modal', function () {
alert(2);
}, { once: true });
}
</script>
1条答案
按热度按时间hmmo2u0o1#
bootstrap模态中使用的事件必须在用于示例化模态的div（
document.getElementById('subsModal')）上跟踪，而不是在bootstrap.Modal对象（new bootstrap.Modal(document.getElementById('subsModal'))）上跟踪。查看modal docs和模态事件文档中的更多内容。