如何使用jquery打开模态弹出窗口？ [英] How do I open modal popup using jquery?
本文介绍了如何使用jquery打开模态弹出窗口？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有一个div我想用Jquery打开它作为弹出窗口，但它无法正常工作。
我从一些例子中尝试这个。我按照步骤根据示例视频中的步骤。下面是给出的完整代码。
我尝试了什么：
I have a div I want to open it as a popup using Jquery but its not working.
I am trying this from some example.I have followed the steps as per The Steps in the Example's video.Below are the complete code given.
What I have tried:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8" />
<link href="Content/bootstrap.min.css" rel="stylesheet" />
</head>
<body style="padding-top:20px">
<div class="col-md-10 col-md-offset-1">
<div class="well">
<table class="table table-bordered">
<thead>
<tr class="success">
<td colspan="2">
New User Registration
</td>
</tr>
</thead>
<tbody>
<tr>
<td>
Email
</td>
<td>
<input type="text" id="textEmail" placeholder="Enter Email" />
</td>
</tr>
<tr>
<td>
Password
</td>
<td>
<input type="text" id="textpassword" placeholder="Enter Password" />
</td>
</tr>
<tr>
<td>
Coinfirm Password
</td>
<td>
<input type="text" id="textCoinfirmPassword" placeholder="Enter Coinfirm Password" />
</td>
</tr>
<tr class="success">
<td>
<input type="button" id="btnRegister" class="btn btn-success" value="Register" />
</td>
</tr>
</tbody>
</table>
<div class="modal fade" tabindex="-1" id="successModal" data-keyboard="false" data-backdrop="static">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dissmiss="modal">
×
</button>
<h4>success</h4>
</div>
<div class="modal-body">
<h2>Registration Successful</h2>
</div>
<div class="modal-footer">
<button type="button" data-dissmiss="modal" class="btn btn-success">
Close
</button>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="Scripts/bootstrap.min.js"></script>
<script src="Scripts/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#btnRegister").click(function () {
// alert('hiiiii');
$("#successModal").modal('show');
});
});
</script>
</body>
</html>
推荐答案
（文件）.ready（function（）{
(document).ready(function () {
（＃btnRegister）。click（function（）{
// alert（'hiiiii'）;
("#btnRegister").click(function () { // alert('hiiiii');
（＃successModal）。modal（ 'show'）;
}）;
}）;
< / script>
< / body>
< / html>
("#successModal").modal('show'); }); }); </script> </body> </html>
这篇关于如何使用jquery打开模态弹出窗口？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
