0

私はJQMを使用してアプリを作成していますが、ユーザーが戻ることができるように履歴を保持したいのですが、戻ると1つのページに表示され、ajaxのロードに失敗します。私のページはすべて外部にあり、pageinitイベントで読み込まれます。この同じコード構造は、このページを除く他のすべてのページで機能しますが、コードで確認できるエラーではないことに注意してください。以下のコードを参照してください。

HTML:

<!doctype html>
<html lang="en">
<head>
    <title>Music App</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1">
    <link rel="stylesheet" href="http://jquerymobile.com/demos/1.3.0/css/themes/default/jquery.mobile-1.3.0.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
    <script src="http://jquerymobile.com/demos/1.3.0/js/jquery.mobile-1.3.0.js"></script>
    <script src="./javascript/music.js"></script>
    <script src="./javascript/soundmanager2.js"></script>
</head>
<body>
    <!--load all songs by genre-->
    <div data-role="page" data-add-back-btn="true" id="genretracks">
        <div data-role="header" data-position="fixed">
            <h1>Genre Tracks</h1>
        </div>
        <div data-role="content">
            <ul data-role="listview" data-filter="true" data-filter-placeholder="Search list..." id="genretracklist">
            </ul>
        </div>
    </div>
</body>
</html>

JavaScript:

 $(document).on( "pageinit", "#genretracks", function( e ) {
var passedId = (passDataObject.selectedHref != null ? passDataObject.selectedHref : window.location.href).replace( /.*id=/, "" );
var surl =  "http://localhost/musicapp/includes/genretracks.php";
$.ajax({
    type: "GET",
    url: surl,
    data:  "Genre="+passedId,
    dataType: "jsonp",
    cache : false,
    jsonp : "onJSONPLoad",
    jsonpCallback: "genretrackscallback",
    crossDomain: "true",
    }).done(function(){ 
        $("a").bind("click",function(){
            passDataObject.selectedHref = this.href;
        }); 
    }).fail(function(){ 
        alert("$.get failed!"); //replace with failed dialog 
    })
});


 function genretrackscallback(rtndata) 
 { 
var data="";
for(j=0;j<=rtndata.length -1;j++)
{
    data = data + "<li><a href='./player.html?id="+rtndata[j].track_id+"' data-transition='slide' id="+rtndata[j].track_name+"><h3>" + rtndata[j].track_name + "</h3><p><strong>" + rtndata[j].artist_name + "</strong></p><p>" + rtndata[j].genre_name + "</p></a></li>";
}
$('#genretracklist').html(data);
$('#genretracklist').listview('refresh'); 
 }

上記の関数によって作成されたリスト内の項目をクリックすると、ID に基づいて別の JavaScript 関数が起動され、ユーザーが別の外部ページに移動します。これはすべて正常に機能しますが、ユーザーが上記の関数を押し戻したときに、数回試行した後に 1 回起動しないか、1 回起動します。ユーザーが戻ったときにこの関数が確実に起動するようにするにはどうすればよいですか?

4

0 に答える 0