我有简单的 html 页面来显示引导模式，但是当我启动模型时 - 它被模态背景覆盖， 我检查了 myModal 的 z- 索引 - 1040，模态背景的 z- 索引是 1030 检查了 stackoverflow 中的所有帖子，但没有一个能解决我的问题 请帮忙
<html>
<head>
<link href="" rel="stylesheet">
<link href="Content/bootstrap.min.css" rel="stylesheet">
<script src="Scripts/jquery-1.10.2.min.js"></script>
<script src="Scripts/bootstrap.min.js"></script>
</head>
<body>
<a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a>
<div id="myModal" class="modal hide fade in" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">X</button>
<h3 id="myModalLabel">Log in</h3>
</div>
<div class="modal-body">
<form class="modal-form" id="loginform">
<input type="text" name="username" placeholder="login" id="username">
<input type="text" name="password" placeholder="password" id="userpassword">
</form>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
<button class="btn btn-success">Login</button>
</div>
</div>
</body>
</html>
最佳答案
你忘记了一些事情，它们是:
<div class="modal-dialog"><div class="modal-content">
您还添加了一些不必要的东西:
hide在<div id="myModal" class="modal fade in" aria-hidden="true">上课in在<div id="myModal" class="modal fade in" aria-hidden="true">上课
您的工作代码将如下所示:
<a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a>
<div id="myModal" class="modal fade in" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">X</button>
<h3 id="myModalLabel">Log in</h3>
</div>
<div class="modal-body">
<form class="modal-form" id="loginform">
<input type="text" name="username" placeholder="login" id="username">
<input type="text" name="password" placeholder="password" id="userpassword">
</form>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
<button class="btn btn-success">Login</button>
</div>
</div>
</div>
</div>
这是一个 JsFiddle在工作环境中展示它。
要阅读有关模态的所有信息，请查看 this
希望这对您有所帮助!
关于javascript - 模态背景覆盖的 Bootstrap 模型，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34467721/