jQuery Mobile的回來上一頁onclick事件不工作

我想創建由具有單頁模板架構的第一頁三頁的一個應用程序包含一個登錄頁面，我使用jQuery Mobile的回來上一頁onclick事件不工作

$.mobile.changePage('xxxx.php');瀏覽其工作正確地在第二頁我有ListView控件從那裏我要前往使用

$.mobile.changePage('xxxx.php'); 另一頁面和回來上一頁我用這$.mobile.changePage('xxxx.php');

但是，當我去上一個上點擊委託方法頁列表視圖任何ot她的方法不起作用。但是，它刷新頁面後，它的作品。

以下是我的代碼。任何建議都會很棒。

secondpage.php

<!DOCTYPE html> 
<html> 
<head> 

<title> Management</title> 

    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>jQuery Mobile</title> 
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 

    <script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script> 

    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" /> 

<link rel="stylesheet" href="./js/jquery.mobile-1.3.1.min.css" /> 

<script src="./js/jquery.mobile-1.3.1.min.js"></script> 

</head> 
<body > 
<div data-role="page" id="demo-page" > 

<div data-role="header" id="header" data-position="fixed" data-tap-toggle="false" data-fullscreen="true" data-theme="a" > <!-- data-position="fixed" data-tap-toggle="false" --> 


<a href="#menu" data-role="button" data-inline="true" data-icon="bars" data-iconpos="notext" class="ui-btn-left" ></a> 
<a href="" id="edit" data-role="button" data-inline="true" class="ui-btn-right">Edit</a> 

<h1 style="font-size:14px;">Event Management</h1> 

</div> 

<div data-role="content" id="content" > 

<div id="listdiv" style="margin-top:15%;margin-bottom:10%;"> 

    <ul data-role="listview" id="list" class="ui-listview " data-split-icon="delete" data-filter="true" data-filter-placeholder="Search..." > 

    <li data-icon="false" data-name="<?php echo $token_res['event_name'];?>" value="<?php echo $token_res['msg_body'];?>" id="read"> 
<a href=" " data-transition="slide" >list1</a><a class="deleteMe"></a> 
</li> 
<li data-icon="false" data-name="<?php echo $token_res['event_name'];?>" value="<?php echo $token_res['msg_body'];?>" id="read"> 
<a href=" " data-transition="slide" >list2</a><a class="deleteMe"></a> 
</li> 
</ul> 
</div> 
</div><!--end of content --> 
    <script> 

    $("#list").delegate('li',"click",function(){ 

    var ki=$(this).attr('data-name'); 

    //alert("clicked"+$(this).attr('data-name')+$(this).attr('value')); 
    $(document).one("pagechange", function() { 
     $.mobile.changePage("edit.php",{type:'post',transition: "slide", data: {'param1':ki}}); 
     }); 

    }); 
    $(document).ready(function() { 

    }); 
    </script> 
    <div data-role="footer" id="mainfooter" data-theme="a" data-fullscreen="true" data-position="fixed" data-tap-toggle="false" style=" bottom:0; width:100%;"> 

    </div> 

</div><!--end of page --> 

</body> 
</html>

thirdpage.php

 <!DOCTYPE html> 
    <html> 
    <head> 

    <title>Management</title> 


     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <title>jQuery Mobile</title> 
     <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 

     <script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script> 

     <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" /> 

    <link rel="stylesheet" href="./js/jquery.mobile-1.3.1.min.css" /> 

    <script src="./js/jquery.mobile-1.3.1.min.js"></script> 

    </head> 
     <body > 
     <div data-role="page" id="demo-page1" > 

     <div data-role="header" id="header" data-position="fixed" data-tap-toggle="false" data-fullscreen="true" data-theme="a" > 

     <a href="" data-role="button" id="mback" data-inline="true" class="ui-btn-left" >Back</a> 
     <a href="" id="medit" data-role="button" data-inline="true" class="ui-btn-right" >Edit</a> 

     <h1 style="font-size:14px;">Management</h1> 

     </div> 
     <div data-role="content" id="content" > 

     <ul data-role="listview" data-inset="true" style="margin-top:10%;margin-bottom:10%;" > 
     <li data-role="fieldcontain"> 
     <label for="eventbody">Message-Body</label> 
     <input type="text" id="eventbody" value=<?php echo decode($_REQUEST['msg_body']);?> > 
     </li> 
     <li data-role="fieldcontain"> 
     <label for="eventname">Message-Body</label> 
     <input type="text" id="eventname" value=<?php echo decode($_REQUEST['event_name']);?> > 
    </li> 
      <li data-role="fieldcontain"> 
     <label for="sdate">Message-Body</label> 
    <input type="text" id="sdate" value=<?php echo decode($_REQUEST['sdate']);?> > 
     </li> 
     <li data-role="fieldcontain"> 
     <label for="edate">Message-Body</label> 
     <input type="text" id="edate" value=<?php echo $_REQUEST['param1'];?> > 
      </li> 

     <li data-role="fieldcontain" id="nouse" style="display:none;"> 

      <input type="text" id="eid" value=<?php echo decode($_REQUEST['id']);?> > 
     </li> 
     <li > 
     <fieldset class="ui-grid-a"> 
        <div class="ui-block-a"><button type="submit" id="mcancel" data-theme="d">Cancel</button></div> 
        <div class="ui-block-b"><button type="submit" data-theme="a">Submit</button></div> 
      </fieldset> 
     </li> 

     </ul> 

</div><!--end of content --> 

     <div data-role="footer" id="mainfooter" data-theme="a" data-fullscreen="true" data-position="fixed" data-tap-toggle="false" style=" bottom:0; width:100%;"> 

     </div> 

     <script> 

     $("#mback").click(function(){ 
     alert("alert"); 
     if($("#mback").text()=='Back'){ 
     //e.preventDefault(); 
     var page = document.referrer; 
    $.mobile.changePage("home.php",{ 
     transition: 'slide', 
    reloadPage:true, 
     reverse: true 
    }); 

    }else{ 

     $("#eventbody").attr("readonly", "readonly"); 
     $("#eventname").attr("readonly", "readonly"); 
     $("#sdate").attr("readonly", "readonly"); 
     $("#edate").attr("readonly", "readonly"); 

     $("#medit .ui-btn-text").text("Edit"); 
    $("#mback .ui-btn-text").text("Back"); 
    $('#mback .ui-btn-text').button('refresh'); 
    $("#medit .ui-btn-text").button('refresh'); 

    } 

    }); 
     $(document).ready(function() { // <-- ensures the DOM is ready 

     }); 
     </script> 

    </div><!--end of page --> 

    </body> 
    </html>

來源

2013-07-24 Ghouse

我改變了清單委託上點擊的方法，從ID到類，那麼它工作正常通過鏈接answer

來源

2013-07-24 09:40:28 Ghouse

你爲什麼不使用自動回功能。在jquery-1.9.1.min.js和jquery.mobile-1.3.1.min.js之前，在你的腳本中有這樣的代碼：

$ .mobile.page.prototype.options.addBackBtn = true; $ .mobile.page.prototype.options.backBtnText =「Back」;

然後，它會自動在每個頁面上添加按鈕標記，除了第一個頁面和向後路由到前面的頁面。

來源

2013-07-24 08:34:06 Sheetal

我需要重新加載上一頁這就是爲什麼我要去的那個腳本 – Ghouse

爲什麼你需要的建議頁面重新加載？ – Gajotres

我正在更新第三頁中的listview行，它應該反映在第二頁，即使任何新的數據被添加到數據庫中，它會立即反映 – Ghouse

jQuery Mobile的回來上一頁onclick事件不工作

回答

相關問題