在orientationchange之后获取Android移动设备的真实宽度答案

【问题标题】：Get real width of Android mobile device after orientationchange在orientationchange之后获取Android移动设备的真实宽度
【发布时间】：2014-07-27 12:07:25
【问题描述】：

使用 Android HTML5 和 Javascript 真的很令人沮丧。

这一次，我尝试找出加载 DOM 和用户改变方向时的当前屏幕尺寸（宽度）：

screen.width 在不同的 AndroidOS 版本上的工作方式完全不同。无法使用。
jQuery 的 $(window).width() 返回实际宽度，但它会在方向改变之前触发。我尝试了超时 200 毫秒，也不起作用。

然后我尝试了这个sn-p：

var deviceWidth = window.orientation == 0 ? window.screen.width : window.screen.height;

if (navigator.userAgent.indexOf('Android') >= 0 && window.devicePixelRatio) {
  deviceWidth = deviceWidth / window.devicePixelRatio;
}

在某些 Android 版本上，它会随方向而变化，而在某些版本中则不会。

有什么建议吗？

谢谢！

编辑/解决方案：

这就是我在 Android 和 iOS 上的工作方式：

$( window ).on( "orientationchange", function( event ) {
  //console.log( "This device is in " + event.orientation + " mode!" );

  var oc_timer;
  clearTimeout(oc_timer);
  oc_timer = setTimeout(function () {
    //do your magic stuff with jQuery's $(window).width()
  }, 500);
);
$( window ).orientationchange(); //fire it manually on page load

【问题讨论】：

标签： javascript android mobile width

【解决方案1】：

在绑定函数中尝试如下超时

  $(window).bind( 'orientationchange', function(e){
    setTimeout(function() {
       var device_width = $(window).width();
     },500);
   });

在这里阅读更多：Device and Viewport Size In JavaScript

对于

如何获取视口大小

如何获取设备大小。

如何获取文档大小。

另请阅读：http://www.w3schools.com/js/js_window_screen.asp

【讨论】：

谢谢！在第一篇文章中观看我的解决方案。

【解决方案2】：

此方法将为您提供设备的尺寸：

Point size = new Point();
Display display = getWindowManager().getDefaultDisplay();
int height = 0;
int width = 0;
if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.HONEYCOMB_MR2) {
    display.getSize(size);
    width = size.x;
    height = size.y;
} else {
    width = display.getWidth();
    height = display.getHeight();
}

【讨论】：

谢谢，但我需要一个 Javascript 解决方案。