0

jquery モバイル Web アプリを開発しましたが、PC や一部のモバイル デバイスでうまく動作します。今、blackberry z10 と iPad mini でテストしましたが、アプリはこのデバイスでは動作しません。

その理由がlocalStorageへのアクセスであることがわかったサンプルアプリ（以下のコード）を作成します。

set を含む行または localStorage への get アクセスを含む行を削除すると、正常に動作します。

エラー: localStorage アクセスでページを変更できません。線がないと…

localStorage.setItem("test", "testal");

...できます。

コード：

<!DOCTYPE html>
<html>
<head>
    <title>Titel</title>
    <meta name="apple-mobile-web-app-capable" content="yes" />

    <script type="text/javascript" src="/modernizr.js"></script>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/jquery-migrate-1.1.1.min.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
    <div data-role="page" data-theme="c">
        <div data-role="header" data-theme="c">
            <h1>Header</h1>
        </div>
        <div data-role="content">
            <ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="b">
                <li data-role="list-divider">Menü</li>
                <li><a href="#" onclick="next()" data-transition="slide">Example</a></li>
            </ul>
        </div>
    </div>
    <div data-role="page" data-theme="c" id="runde">
        <div data-role="header" data-theme="c">
            <h1>Header 2</h1>
        </div>
        <div data-role="content">
            <h1>Page 2</h1>
        </div>
    </div>
</body>
<script type="application/javascript">
    function next() {
        localStorage.setItem("test", "testal");
        $.mobile.changePage( "#runde", { transition: "slide" });
}
</script>
</html>
4

1 に答える 1