

monacaで開発しており、index.htmlからdetail.htmlに飛んだ時に飛先のdetail.htmlでjasonを動かしたいのですが動いてる気配がなく困っています。  
飛んだ際もスライドして飛び「ロード中」のようなページを読み込む感じもないのでそれでjsonが呼び出されていないのかとも色々と考えてます。  
ご教示いただけると幸いです。

↓index.html↓

[code]

    <script>
    
            function categoryItem(url,title) {
                // detail.htmlに遷移
                myNavigator.pushPage("detail.html",{
                    animation: 'slideRight', 
                    url : url, // 渡すデータ
                    title : title,  // 渡すデータ
                })
            }
    
            // detail.htmlのページ初期化のイベント
            document.addEventListener("pageinit", function(e) {
                if (e.target.id == "page-detail") {
                    // 渡したデータを取得して表示
                    var options = myNavigator.getCurrentPage().options;
                    $('#page-detail').find('.url').text(options.url);
                    $('#page-detail').find('.title').text(options.title);
                }
            }, false);
        </script>
    
       <li><a href="#" onClick="categoryItem('×××','楽しい系')">タイトル</a></li>
    
[/code]

↓detail.html↓

[code]

                  $.ajax({
                    type: 'GET',
                    url: 'http://○○○.jp/json/楽しい系のjsonデータ.php',
                    dataType: 'json',
                    success: function(json){
                        var len = json.length;
                        for(var i=0; i < len; i++){
                            $("#list").append('<airtcle"></article>');
                        }
                    }
                });
                },false);
    
     <body>
        <section class="load__wrap">
            <ons-navigator title="Navigator" var="myNavigator">
                <ons-page id="page-detail">
                    <ons-toolbar>
                        <div class="title"></div>
                    </ons-toolbar>
                    <section id="list"></section>
                </ons-page>
            </ons-navigator>
    
        </section>
    </body>
    
[/code]


CC BY-SA 3.0
2016-01-10T14:47:31.653
20809
2016-09-27T05:30:19.223
2016-01-10T15:34:47.733
5044
13775
question
monaca html5 json
ページ遷移後のjson呼び出しについて動かなくて困っています。


ons-navigatorで画面遷移を行っているようですが、  
遷移先の画面はiframe内に埋め込まれるので  
スクリプトはindex.htmlで定義するのがよいようです。

index.html

[code]

    <script>
        ons.bootstrap();
    
        function categoryItem(url,title) {
            // detail.htmlに遷移
            myNavigator.pushPage("detail.html",{
                animation: 'slideRight', 
                url : url, // 渡すデータ
                title : title,  // 渡すデータ
            })
        }
    
        // detail.htmlのページ初期化のイベント
        document.addEventListener("pageinit", function(e) {
            if (e.target.id == "page-detail") {
                // 渡したデータを取得して表示
                var options = myNavigator.getCurrentPage().options;
                $('#page-detail').find('.url').text(options.url);
                $('#page-detail').find('div.center').text(options.title);
    
                $.ajax({
                    type: 'GET',
                    url: 'http://○○○.jp/json/楽しい系のjsonデータ.php',
                    dataType: 'json',
                    success: function(json){
                        var len = json.length;
                        for(var i=0; i < len; i++){
                            $("#list").append('<airtcle></article>');
                        }
                    }
                });
            }
        }, false);
    </script>
    <body>
    <ons-navigator title="Navigator" var="myNavigator">
        <ons-page>
            <a href="#" onClick="categoryItem('×××','楽しい系')">タイトル</a>
        </ons-page>
    </ons-navigator>
    </body>
    
[/code]

detail.html

[code]

    <ons-page id="page-detail">
        <ons-toolbar>
        </ons-toolbar>
        <section id="list"></section>
    </ons-page>
    
[/code]


CC BY-SA 3.0
2016-01-14T01:32:51.287
20900
2016-01-14T01:32:51.287
13314
20809
answer