jQuery Mobile will background-load additional 'pages' into the DOM, then transition to them. This works well sometimes, but in the example where one uses a JSP servlet, it seems to break. I wondered what the best way to do this would be.
For instance, say we have on our first page this:
<div data-role="page" id="home">
<div data-role="content">
<a href="jqmServlet?value=1.1">1.1</a>
</div>
</div>
Where the 1.1 is something that can be different, and so cause the servlet to do something different.
Now the servlet returns a page containing this:
<div data-role="page" id=${pageThing}>
<div data-role="content">
<a href="#OTHER_1">other 1</a></li>
</div>
</div>
<div data-role="page" id="OTHER_1">
<div data-role="content">
<p>Other 1 Content</p>
</div>
</div>
Starting the first page, I click "1.1", it goes to the servlet, and I see the "other 1" link. So that is all expected. But when I click "other 1", it fails because the underlying link looks like jqmServlet?value=1.1#OTHER_1
, which is clearly not what I intended. What I intended was the "Other 1 Content" be displayed just using the content already in the DOM.
I started playing开发者_如何学编程 with the "data-url" parameter, but haven't figured out the secret handshake yet.
What's the right way to do this?
EDIT: It seems to me this would be a standard thing that would need to get done. I tried dozens of variations of the data-url, but I could not get it working properly; there was always some problem with the URL or if I got the URL looking pretty good, it still didn't show the 'OTHER_1' page (it just acted as if that page in the DOM didn't exist). I was going to replace the link with a call to JavaScript, but that sort of negates the value of this tool. Anyone have any ideas at all?
精彩评论