1

私は StackOverflow が初めてで、これが私の最初の質問です。何か間違ったことをしている場合はすみません。

私の質問は、そのページが load() メソッドを使用して動的に読み込まれたページの複数の div で iScroll 4 を動作させる方法です。

したがって、それをより単純なものに分解するには:

page.html という別のページがあります

<html>
      <body>

            <ul data-iscroll="scroller">
               ..lots of data..
            </ul>

            <ul data-iscroll="scroller">
               ..lots of data..
            </ul>

      </body>
</html>

次に、私のindex.htmlページには、すべてのライブラリを含む通常のヘッダータグがあり、正常にロードされています(実際にindex.htmlページにリストがある場合-> iScrollが正常に機能するため、機能することはわかっています。リストが動的にロードされます)

私のindex.htmlの本体は

<body>

      <div data-role="page>
            <div data-role="header" data-position="fixed">
                  <h3>header</h3>
            </div>

            <div data-role="content" id="content">
                 <!-- always empty - data will be loaded here -->
            </div>

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

</body>

ページは次の方法でコンテンツに読み込まれます (すべてを表示できるため、これも機能します)

$("#content").load("page.html",function(){
    $("#content").trigger('create');
});

そして、あなたも知っているように、私の含まれているライブラリは

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0-beta.1/jquery.mobile-1.3.0-beta.1.min.css" />
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.0-beta.1/jquery.mobile-1.3.0-beta.1.min.js"></script>
<!-- jScroll -->
<script src="iscroll.js" type="text/javascript"></script>
<script src="jquery.mobile.iscrollview.js" type="text/javascript"></script>

Chromeを使用して要素を検査すると、すべてのデータが表示され、すべてがそこにありますが、<ul>期待どおりに2つが別々にスクロールしません。私が間違っていることを誰かが知っていますか?

PS。python -m SimpleHTTPServer 8013 また、これは携帯電話用であるため、PhoneGap による Ripple エミュレーターを使用して実行し、画面の解像度などをテストする単純なサーバー上で実行しています。

4

1 に答える 1