如何在另一个JSP页面中的一个JSP页面中调用引导模式存储？

Question

我有一个JSP页面，其中包含整个模态说模态结构（页眉，正文和页脚）。 该页面如下

<% @ page language = "java" contentType = "text/html; charset=ISO-8859-1"
pageEncoding = "ISO-8859-1"
%>
<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Bootstrap Example</title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    </head>
    <body>

        <!-- Modal -->
        <div class="modal fade" id="myModal" role="dialog">
            <div class="modal-dialog">

                <!-- Modal content-->
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                        <h4 class="modal-title">Modal Header</h4>
                    </div>
                    <div class="modal-body">
                        <p>Some text in the modal.</p>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    </div>
                </div>

            </div>
        </div>

    </body>
</html>

我还拥有另一个JSP页面，在其中单击按钮Open Modal ，将打开上述JSP页面中ID为myModal存储的模态。当前页面将保持不变，此外还将在其上打开模态弹出窗口。 这是我称之为模式的页面

<% @ page language = "java" contentType = "text/html; charset=ISO-8859-1"
pageEncoding = "ISO-8859-1"
%>
<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Bootstrap Example</title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    </head>
    <body>
        <div class="container">
            <h2>Modal Example</h2>
            <!-- Trigger the modal with a button -->
            <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button>
        </div>
    </body>
</html>

我怎么得到的？

Answer 1

如果模式的HTML未在页面上呈现，那么如果没有Ajax，则无法执行。 您将需要创建一个ajax函数，该函数将仅获取模态的HTML代码并将其放在当前正文中的某个位置（可能使用jquery的append），然后可以显示它。

Answer 2

首先，您的Moal代码只需要一个div和东西，您就不想在代码中包含一个其他HTML文档。

您想通过导入将文件包含在内，或者将其包含在要使用模式的页面范围内，然后在js中执行$("#myModal").modal('show')

如何在另一个JSP页面中的一个JSP页面中调用引导模式存储？

问题描述

2 个解决方案

解决方案1
0 2016-10-26 08:16:42

解决方案2
0 2016-10-26 13:47:53

如何在另一个JSP页面中的一个JSP页面中调用引导模式存储？

问题描述

2 个解决方案

解决方案1 0 2016-10-26 08:16:42

解决方案2 0 2016-10-26 13:47:53

解决方案1
0 2016-10-26 08:16:42

解决方案2
0 2016-10-26 13:47:53