Question

我试图在Java MVC（使用Vraptor）中实现历史api，

如果你点击/ index中的链接，它会加载#content div中的内容（确定）

但是当您输入/ content1并在网址栏中按Enter键时，它只显示内容1，而不显示菜单

此页面仅用于测试，在实际环境中我将使用.js文件：

index.jsp（从/ index访问）

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<div id="container">
<div id="menu"></div>
<div id="content"></div>
</div>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
    $("#menu").load("${pageContext.request.contextPath}/menu");       
</script>

<script>

</script>
</body>
</html>

menu.jsp（可以通过/ menu访问）

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<a href="${pageContext.request.contextPath}/content1"> Link 1</a>
<br>
<a href="${pageContext.request.contextPath}/content2"> Link 2</a>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

  <script>

$('a').click(function() {

    pageurl = $(this).attr('href');
     $.ajax({
        url: $(this).attr('href'),
        dataType: "html",
       // beforeSend: function(xhr){
         //   xhr.setRequestHeader('X-PJAX', 'true')
        //},
        success: function(response, status, xhr){
            $('#content').empty().append(response);
            history.pushState({path:pageurl},'',pageurl)
        }       
    });

    return false;
    });

</script>

</body>
</html>

content1（可以通过/ content1访问）

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
content1
</body>
</html>

content2.jsp（由/ content2访问）

与content1相同，我只是将1改为2）

当我通过在url bar / content1或/ content2中写入并按Enter键时，如何加载，它也会加载/菜单？（完整网站，链接从索引，但在content1的页面）如果我写content2，加载菜单，但在#content中显示content2？

HTML5 History API只是从索引页面完全加载

0 个答案: