iPhone UIWebView 本地资源使用 Javascript 并处理 onorientationChange-移动开发问题

iPhone UIWebView local resources using Javascript and handling onorientationChange(iPhone UIWebView 本地资源使用 Javascript 并处理 onorientationChange)

本文介绍了iPhone UIWebView 本地资源使用 Javascript 并处理 onorientationChange的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在尝试从 iPhone 应用程序的本地资源中提供 HTML Javascript 和 CSS 内容，但在处理 onOrientationChange 事件和包含外部 Javascript 时遇到了问题.

I'm trying to server HTML Javascript and CSS content from an iPhone application's local resources, and I'm having trouble handling onOrientationChange events and including external Javascript.

我似乎能够正确链接 CSS，但不能正确链接 javascript.我正在尝试使用以下处理 onOrientationChange 的示例(如何建立一个 iPhone 网站) 但我从我的应用程序的 NSBundle mainBundle 提供网页.

I seem to be able to link in CSS properly but not javascript. I'm trying to use the following example of handling onOrientationChange (How to build an iPhone website) but I'm serving the webpage from my app's NSBundle mainBundle.

我尝试将 javascript 函数附加到 body.onorientationchange 和 window.onorientationchange，但在本地(或远程)从 UIWebView 提供服务时都不起作用，但如果我使用的是 iPhone Safari，它会起作用.

I tried attaching a javascript function to body.onorientationchange and to window.onorientationchange but neither work when served from UIWebView locally (or remotely), but it works if I'm using the iPhone Safari.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title>How to build an iPhone website</title>

    <meta name="author" content="will" />
    <meta name="copyright" content="copyright 2008 www.engageinteractive.co.uk" />
    <meta name="description" content="Welcome to engege interactive on the iPhone!" />
    <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;">
    <link rel="apple-touch-icon" href="images/template/engage.png"/>

    <style type="text/css">
        @import url("iphone.css");
    </style>
    <!--
    <script type="text/javascript" src="b3JpZW50YXRpb24uanM="></script>
    -->
    <script type="text/javascript">


function updateOrientation(){
    try  {
        var contentType = "show_normal";
        switch(window.orientation){
            case 0:
                contentType = "show_normal";
                break;

            case -90:
                contentType = "show_right";
                break;

            case 90:
                contentType = "show_left";
                break;

            case 180:
                contentType = "show_flipped";
                break;
        }

        document.getElementById("page_wrapper").setAttribute("class", contentType);
        //alert('ORIENTATION: ' + contentType);
    }
    catch(e) {
        alert('ERROR:' + e.message);
    }
} 

window.onload = function initialLoad(){
    try {
        loaded();
        updateOrientation();
    }
    catch(e) {
        alert('ERROR:' + e.message);
    }
}

        function loaded() {
            document.getElementById("page_wrapper").style.visibility = "visible";

        }


    </script>

</head>

<body onorientationchange="updateOrientation();">

    <div id="page_wrapper">
        <h1>Engage Interactive</h1>
        <div id="content_left">
            <p>You are now holding your phone to the left</p>
        </div>
        <div id="content_right">
            <p>You are now holding your phone to the right</p>
        </div>
        <div id="content_normal">
            <p>You are now holding your phone upright</p>
        </div>
        <div id="content_flipped">
            <p>This doesn't work yet, but there is a chance apple will enable it at some point, so I've put it in anyway. You would be holding your phone upside down if it did work.</p>
        </div>
    </div>

</body>
</html>

问题描述

推荐答案