如何使用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打开模态弹出窗口？

相关推荐