遇到jquerymobile回家的问题

Question

我有一个页面有一些div用不同的id在div之间移动，我移动到div之一的面板但是当我返回到主页面项目（面板）列表不起作用。这是代码的一部分......我该怎么做

<div data-role="page" id="main" data-theme="a">
 <div data-role="panel" data-position-fixed="true" data-display="overlay"           id="listpanel">
   <ul data-role="listview" style="float:right">
        <li>
            <a href="#page1">item1</a>
        </li>
        <li>
            <a href="#page2">item2</a>
        </li>
</ul>
</div>  
<div data-role="header">
<h1>mainheader</h1>
</div>
<div data-role="page" id="page1" data-theme="a">
<div data-role="panel" data-position-fixed="true" data-display="overlay" id="listpanel">
    <ul data-role="listview" style="float:right">
        <li>
            <a href="#page1">item1</a>
        </li>
        <li>
            <a href="#page2">item2</a>
        </li>
</ul>
</div>
<div data-role="header">
<h1>item1</h1>
</div>
<div data-role="navbar">
<ul class="ui-btn ui-corner-all">
    <li><a href="#listpanel">list</a></li>
    <li><a href="#main">mainpage</a></li>
</ul>
</div>
<div data-role="content">Content</div>
</div>
<div data-role="page" id="page2" data-theme="a">
<div data-role="panel" data-position-fixed="true" data-display="overlay" id="listpanel">
    <ul data-role="listview" style="float:right">
        <li>
            <a href="#page1">item1</a>
        </li>
        <li>
            <a href="#page2">item2</a>
        </li>
</ul>
</div>
<div data-role="header">
<h1>item2</h1>
</div>
<div data-role="navbar">
<ul class="ui-btn ui-corner-all">
    <li><a href="#listpanel">list</a></li>
    <li><a href="#main">mainpage</a></li>
</ul>
</div>
<div data-role="content">Content</div>
</div>