1

ユーザーがリスト要素をクリックできるページにレンダリングしているJavascript関数があり、そのリスト要素に関する詳細情報を表示する新しいページに移動します。元のページは#indexで、2番目のページは＃index2で、1つのマルチページHTMLページを使用してコード化されています。ただし、index2ページを独自のhtmlファイル（index2.html）に移動できることを望んでいますが、要素が新しいファイルに移動できるように、関数内で新しいindex.htmlファイルを参照する方法がわかりません。

私のコードは次のとおりです。

    <script type="text/javascript">
    $(document).on('pagebeforeshow', '#index', function(){
        $("#list").empty();
        var url="http://localhost/tmp/json4.php";
        $.getJSON(url,function(json){
            //loop through deals
            $.each(json.deals,function(i,dat){
                $("#list").append("<li><a id='"+dat.dealid+"' data-restaurantid=" + dat.restaurantid + " data-image=" + dat.image + "><h1>"+dat.name+"</h1><h6>"+dat.dname+"</h6><h5>"+dat.description+"</h5></a></li>");
                $(document).on('click', '#'+dat.dealid, function(event){  
                    if(event.handled !== true) 
                    {
                        dealObject.dealID = $(this).attr('id'); 
                        dealObject.restaurantid = $(this).attr('data-restaurantid');
                        dealObject.shortName = $(this).find('h1').html(); 
                        dealObject.image = $(this).attr('data-image');
                        dealObject.dealName = $(this).find('h6').html();
                        dealObject.description = $(this).find('h5').html(); 

                        $.mobile.changePage( "#index2", { transition: "slide"} );
                        event.handled = true;
                    }
                });            
            });
            $("#list").listview('refresh');
        });
    });

    $(document).on('pagebeforeshow', '#index2', function(){       
        $('#index2 [data-role="content"]').find('#deal-img').attr('src',dealObject.dealObject);
        $('#index2 [data-role="content"]').find('#title').html(dealObject.name);
                $('#index2 [data-role="content"]').find('input#desc').val(dealObject.description);
                $('#index2 [data-role="content"]').find('input#tname').val(dealObject.dealName);
                $('#index2 [data-role="content"]').find('input#dealid').val(dealObject.dealID);


    });

    var dealObject = {
        dealID : null,
        restaurantid : null,
        shortName : null,
        image : null,
        dealName : null,
        description: null
    }    
</script>

誰かが私を助けてくれるなら、私は本当に感謝します。

4

2 に答える 2

1

ページを2つのphpファイルに分割する必要があります。1つはview.phpと呼ばれ、もう1つはoffer.phpと呼ばれます。

2つの追加ディレクトリを作成します。1つはamendと呼ばれ、もう1つはdelと呼ばれます。どちらにも、修正または削除機能に関連するロジックを備えたjsファイルと、必要な機能のphp/ajaxプロキシとして機能するphpファイルがあります。

また、2つのajax呼び出しが正しい場所を参照する必要があり、ajax応答も魔女のアクションが実行されたことを示す必要があることに注意してください。

于 2013-02-20T14:38:29.590 に答える
0

私の推測では、index2.htmlと同じページに存在しなくなったため、index2.htmlに対してサーバーにAjaxリクエストを行う必要があります。これが例です

$.ajax({
   url : '/pages/index2.html',
   type: 'get',
   success: function (html) {
     // here , you can use jquery to manipulate
     // the HTML in index2. Maybe pop up a lightbox, etc..
   }
});

あなたが何をしようとしているのかわかりませんが、Ajaxは舞台裏で新しいHTML/データを要求するかなり標準的な方法です。JQueryajaxでできることはたくさんあります。これがドキュメントです

Jquery Ajax

于 2013-02-19T20:59:03.567 に答える