<div data-role="page" id="page1">

<script type="text/javascript">

$(function(){     

 　　$("#page1").bind("swipeleft",function(){         

 　　　　$.mobile.changePage("#page2",{transition: "slide",changeHash: true});     

  　　});    

　　$("#page1").bind("swiperight",function(){         

  　　　　$.mobile.changePage("#page3", {transition:"slidefade",reverse:true,changeHash: true}, true, true);     

  　　});

});

</script>

<div data-role="header" data-position="fixed">

//头部

</div>

<div data-role="content">

//中部

</div>

<div data-role="footer" data-position="fixed">

//尾部

</div>

</div>

<div data-role="page" id="page2">

<script type="text/javascript">

$(function(){    

　　$("#page2").bind("swipeleft",function(){         

　　　　$.mobile.changePage("#page3",{transition: "slide",changeHash: true});     

　　});    

    $("#page2").bind("swiperight",function(){        

          $.mobile.changePage("#page1", {transition:"slidefade",reverse:true,changeHash: true}, true, true);    

    });

});

</script>

<div data-role="header" data-position="fixed">

//头部

</div>

<div data-role="content">

//中部

</div>

<div data-role="footer" data-position="fixed">

//尾部

</div>

</div>

<div data-role="page" id="page3">

<script type="text/javascript">

$(function(){    

　　$("#page3").bind("swipeleft",function(){        

　　　　$.mobile.changePage("#page1",{transition: "slide",changeHash: true});    

　　});    

　　$("#page3").bind("swiperight",function(){        

　　　　$.mobile.changePage("#page2", {transition:"slidefade",reverse:true,changeHash: true}, true, true);    

　　});

});

</script>

<div data-role="header" data-position="fixed">

//头部

</div>

<div data-role="content">

//中部

</div>

<div data-role="footer" data-position="fixed">

//尾部

</div>

</div>