jsp中利用Jquery点击按钮弹出模态框

在 JSP 页面中使用 jQuery 实现弹出模态框可以使用 Bootstrap 框架，遵循以下步骤：

1. 首先在 JSP 页面中引入 Bootstrap 和 jQuery 库：

<!-- 引入 jQuery 库 -->
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>

<!-- 引入 Bootstrap 样式库 -->
<link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

<!-- 引入 Bootstrap JavaScript 库 -->
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

2. 在 JSP 中添加一个按钮，并为它添加一个 id：

<button type="button" id="myBtn" class="btn btn-primary">弹出模态框</button>

3. 在 JS 文件中编写弹出模态框的代码：

$(document).ready(function(){
    $("#myBtn").click(function(){
        $("#myModal").modal();
    });
});

4. 在 JSP 页面中添加模态框的 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-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">模态框标题</h4>
            </div>
            <!-- 模态框主体 -->
            <div class="modal-body">
                <p>模态框内容</p>
            </div>
            <!-- 模态框底部 -->
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary">保存</button>
            </div>
        </div>
    </div>
</div>

这样，在 JSP 页面中点击按钮就会弹出一个模态框。你可以根据需要修改模态框的标题、内容和按钮等。