jquery - 尝试实现登录弹出窗口,但引导模式不可点击
问题描述
我正在尝试在我的页面上添加一个登录弹出窗口,但在它弹出后,它是不可点击的(输入字段和按钮)
我对自定义 Web 应用程序开发很陌生,所以我采购了一些组件。我正在为客户开发这个项目,同时提高我的技能并从 wordpress 即插即用生活方式中脱颖而出
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Sedima</title>
<!-- Core CSS -->
<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- popupstyles -->
<link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
<link rel='stylesheet' href='http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css'>
<link rel="stylesheet" type="text/css" href="css/menu.css" media="all" />
<script src="js/jquery-1.7.2.min.js"></script>
<script src='https://netdna.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js'></script>
<div class="modal fade" id="login-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;">
<div class="modal-dialog">
<div class="loginmodal-container">
<h2>Registration</h2>
<form>
<input type="text" name="user" placeholder="Username">
<input type="password" name="pass" placeholder="Password">
<input type="submit" name="login" class="login loginmodal-submit" value="Register">
</form>
<div class="login-help">
<a href="#">Login</a> - <a href="#">Forgot Password</a>
</div>
</div>
</div>
</div>
<!-- Scrips -->
<!-- Core JavaScript -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- jQuery lib from google server ===================== -->
<script src="js/jquery-1.7.2.min.js"></script>
<!-- Plugin JavaScript -->
<script src="vendor/jquery-easing/jquery.easing.min.js"></script>
<!-- Custom scripts -->
<script src="js/grayscale.min.js"></script>
<!-- popupscripts -->
<!-- value controll and input masking scripts (will prolly replace with my own in future) -->
<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/gsap/1.15.0/TweenMax.min.js'></script>
<!-- custom scripts -->
<script src="js/index.js"></script>
<script src="js/login.js"></script>
<script src="js/reg.js"></script>
解决方案
我假设你不使用
$(function() {
console.log("DOM is ready!");
});
等到文件准备好。
如果 DOM 确实准备好这样做,请确保您的 HTML 修改已完成。