jquery - HTML5 History API just full load from index page -
im trying implement in java mvc (using vraptor) history api,
if click in link /index, load content in #content div (its ok)
but when type /content1 , press enter in url bar, display content1, without menu
this pages test, in real env use .js file:
index.jsp(access /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 (can accessed /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>
the content1(can accessed /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>
the content2.jsp (accessed /content2)
its same of content1, changed 1 2)
how can make when load writing in url bar /content1 or /content2, , pressing enter, load /menu too? (full site, link index, in page of content1) if write content2, load menu displaying content2 in #content?
Comments
Post a Comment