HTML:
<input id="btnShowAdd" name="btnShowAdd" type="button" value="Add" onclick="showformadd()">
<div class="modal-content" id="myModal">
hello
</div>
脚本显示模态对话框:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script type="text/javascript">
function showformadd() {
$("#myModal").modal('show');
}
</script>
结果:不存在错误,但无法显示对话框。为什么? 如何显示对话框?
答案 0 :(得分:1)
您需要遵循模态标记。在您的html中将标记更改为:
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-body">
Hello
</div>
</div>
</div>
</div>
答案 1 :(得分:1)
没有CSS就行不通了!
使用它代替你的脚本并添加boostrap.min.css:
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css">