How to use Jqmobi to develop a jump between the panel of the app base

There are many ways to jump on a PC-side web program, but how do you jump between using Jqmobi to develop app pages?

Can you also use the traditional a label?

Analysis of Jqmobi demo, found that all the pages are written in a page, it seems that only in this page to jump?

Using the Panel property data-defer to separate the pages, how do I jump?

For example: A list page list.html, click a bar to jump to the details page. How to achieve it?

<div id= "list" class= "Panel" data-load= "Loadfirstpage" data-defer= "list.html"   data-tab= "Navbar_picture" >   
</div>

List.html Page Content:

<a href= "detail.html" data-persist-ajax= "true" class= "icon home big ' > Product 1</a> <a href=    
  " detail.html "Data-persist-ajax=" true "class= ' icon home big ' > Product 2</a> <a href=" detail.html "data-persist-ajax="  
  True "class= ' icon home big ' > Product 3</a>  
  <a href=" detail.html "data-persist-ajax=" true "class= ' icon Home Big ' > Products 4</a>

The detail.html page displays different product information through AJAX based on different products.

The test found different product information that could not be loaded in the iOS simulator, which seems to be a bad way to go.

Back to the column page: http://www.bianceng.cnhttp://www.bianceng.cn/OS/extra/

Is it true that you can only jump between the various panel?

How to achieve the above requirements?

After testing found:

Seems really is only between the panel jump, to achieve the above needs to do the following modifications:

Step one: Add Detailpanel to Index.html

<div id= "list" class= "Panel" data-load= "Loadfirstpage" data-defer= "list.html"   data-tab= "Navbar_picture" >   
</div>  
 <div id= "detail" class= "Panel" data-load= "LoadData" data-defer= "detail.html"   data-tab = "Navbar_picture" >   
</div>

Step two, modify a label in the list.html

<a href= "#detail" class= ' icon home big ' > Product 1</a>    
<a href= "#detail"  class= ' icon home big ' > product 2 </a>  
<a href= "#detail"  class= ' icon home big ' > Product 3</a>  
<a href= "#detail"  class= ' icon home big ' > Product 4</a>

The third step is to update the concrete display content of detail.html page according to the different values of a label in list.html in Detail.html.

Author: csdn Blog xuexiaodong2009