javascript - 安卓 View + jquery

Question

我正在使用 webview GUI 开发一个 android 应用程序。我有一个包含页面的元素。它有页眉和页脚。

<div data-role="page">
  <div data-role="header">
    ...
  </div>
  <div data-role="content" id="bg_im">
    ...
  </div>
  <div data-role="footer">
    ...
  </div>
</div>

我想插入一个图像作为内容 div 的背景，这样整个内容不会占用比可用屏幕尺寸更多的空间。

我有一个 javascript 可以做到这一点:

document.getElementById("bg_im").style.height=Math.floor($(window).height() - $('#home_header').height() - $('#home_footer').height() +"px";

该函数在页面加载时执行。

它在桌面浏览器(chrome、mozilla)中运行良好，但在 android 的 webview 中加载时失败。我发现原因是页眉和页脚的函数 .height() 返回值 0。

知道为什么吗？我试过this solution但它也不起作用。它仍然返回页眉/页脚大小 0。

Answer 1

您的主要问题可能来自您的 Math.floor() 方法。您正在混合字符串连接和算术运算。您应该将这些语句分开。

var newHeight = Math.floor($(window).height() - $('#home_header').height() - $('#home_footer').height()); 
$('#bg_img').prop('height', newHeight);