如何在uiwebview中处理Javascript onorientationchange事件

Posted

技术标签:

【中文标题】如何在uiwebview中处理Javascript onorientationchange事件【英文标题】:How to handle Javascript onorientationchange event inside uiwebview 【发布时间】:2011-03-07 14:41:08 【问题描述】:

任何人都可以帮助我在通过 iPhone 中的uiwebview 访问时如何处理 javascript 中的方向更改事件?

我正在尝试捕获 Javascript 的 onorientationchange 事件。我尝试了以下代码:

<style type="text/css" media="only screen and (max-device-width: 480px)">
    .portrait
    
        width: 300px;
        padding: 0 15px 0 5px;
    
    .landscape
    
        width: 460px;
        padding: 0 15px 0 5px;
    
</style>

<script type="text/javascript">
    window.onload = orientationchange;
    window.onorientationchange = orientationchange;
    function orientationchange() 
        if (window.orientation == 90
            || window.orientation == -90) 
            document.getElementById('contents').className = 'landscape';
        
        else 
            document.getElementById('contents').className = 'portrait';
        
    
</script>

// and I have a div inside html

<div id="contents">
    my contents and description... e.t.c, and e.t.c...
</div>

它在 safari 中运行良好,但是当我使用 uiwebview 访问页面时,没有捕获方向更改事件,并且无法实现我想要的功能。

【问题讨论】:

【参考方案1】:

我想将您指向this post: "iphone-uiwebview-local-resources-using-javascript-and-handling-onorientationchang",直接在已接受答案下方的答案确实对您的问题表示敬意:处理应用程序代码中的方向更改并使用javascript注入更改。我引用希望作者不会介意:

“关于在 UIWebView 中未调用 onorientationchange 处理程序的第二个问题的答案:

我注意到 window.orientation 属性无法正常工作,并且没有调用 window.onorientationchange 处理程序。大多数应用程序都会遇到这个问题。这可以通过设置 window.orientation 属性并在包含您的 UIWebView 的视图控制器的 willRotateToInterfaceOrientation 方法中调用 window.onorientationchange 来解决:"

【讨论】:

我不需要本地资源,我只想在我的 html 的 javascript 中捕获方向更改事件 我在试图向您展示但未成功的帖子中添加了一段引述。其实就是你说的问题。 是的,谢谢;我的问题解决了。但是在应用程序中使用启用方向的 html 页面很奇怪。 不客气。是的,不应该这样,但这是解决此错误的好方法。【参考方案2】:

谢谢你。

另一种写法是:

var onorientationchange = function()    
    document.getElementById('contents').className =
      Math.abs(window.orientation == 90)? "landscape" : "portrait";

window.onload = function() 
    window.onorientationchange = window.onorientationchange

【讨论】:

看起来不错,我稍后会检查并告诉您是否有效。 感谢您的回答,但代码中存在括号错误。你想要 Math.abs(window.orientation) == 90,而不是比较的 abs...【参考方案3】:

把这个放到viewDidLoad

[[UIDevice currentDevice]beginGeneratingDeviceOrientationNotifications];
 [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(hasOrientationChanged:) name:@"UIDeviceOrientationDidChangeNotification" object:nil];

- (void)hasOrientationChanged:(NSNotification *)notification 
    UIDeviceOrientation currentOrientation; 
    currentOrientation = [[UIDevice currentDevice] orientation];
    if(currentOrientation == UIDeviceOrientationLandscapeLeft)
        NSLog(@"left");
    

    if(currentOrientation == UIDeviceOrientationLandscapeRight)
        NSLog(@"right");
    


现在你可以用正确的方向调用你的 webview 了 :)

【讨论】:

是的,它在应用程序中是正确的。但是我怎么知道我的 html 页面呢?

以上是关于如何在uiwebview中处理Javascript onorientationchange事件的主要内容,如果未能解决你的问题,请参考以下文章

iOS UIWebView Javascript - 插入数据 - 接收回调?

如何在 UIWebView 加载的 iframe 中注入 javascript - iOS

如何在我的 UIWebview 中注入 javascript

如何在 iOS 中将 javascript 附加到 UIWebView 中?

如何在 UIWebView 上模拟点击事件?

XCode:如何在 UIWebView 中输入 javascript 以单击链接(但链接每次都不同)