Fatal编程技术网
  • android/
  • Android 从本地资产加载时，jQuery Mobile在WebView中不工作

Android 从本地资产加载时，jQuery Mobile在WebView中不工作

android jquery-mobile webview

Android 从本地资产加载时，jQuery Mobile在WebView中不工作,android,jquery-mobile,webview,Android,Jquery Mobile,Webview,我试图在我的Android应用程序中呈现一个使用jQueryMobile创建的页面，但我需要在离线状态下在webView中进行呈现 为此，我开始复制页面的index.html，并将所有必需的资源直接带到设备的内部存储器中。然后我输入file:///sdcard/index.html在我的设备的内部浏览器和Chrome应用程序中，该网站显示得很好，包括jQuery样式和所有 然后我进入我的应用程序，在那里我有一个网络视图，这就是我实际需要呈现上述页面的地方。我使用loadDataWithBaseU

我试图在我的Android应用程序中呈现一个使用jQueryMobile创建的页面，但我需要在离线状态下在webView中进行呈现

为此，我开始复制页面的index.html，并将所有必需的资源直接带到设备的内部存储器中。然后我输入
file:///sdcard/index.html
在我的设备的内部浏览器和Chrome应用程序中，该网站显示得很好，包括jQuery样式和所有

然后我进入我的应用程序，在那里我有一个网络视图，这就是我实际需要呈现上述页面的地方。我使用
loadDataWithBaseURL（）
（因为我最终需要这样做）加载页面，如下所示：

loadDataWithBaseURL("file:///android_asset/web/", html, "text/html", "UTF-8", null);
我将所有资产保存在资产文件夹的web目录中

问题是，如果我加载页面时没有资产引用（通常只调用
loadUrl
），它会加载，但显然没有样式或功能。当我放置资产引用调用
loadDataWithBaseURL
时，它确实正确地读取了资产引用，但是呈现被jqueryMobile的旋转轮卡住，页面从未实际加载。这就是我所看到的：

总而言之：

  • 我已经使用jQuery Mobile创建了一个网站。它只是一个简单的html 带有jQuery样式的页面

  • 我已经准备好离线加载。我打包了所需的资产 在index.html中，我相对地引用了这些资产（例如
    href=“web/styles.css”
    ）

  • 如果我在桌面浏览器中加载此页面，而没有连接，它 工作

  • 如果我在手机浏览器（Chrome或内部浏览器）中加载此页面
    一个），它可以工作

  • 如果我加载此页面，而不在我的webview中加载资产引用， 它可以工作（没有样式或图像等）

  • 如果在我的webview中加载带有资产引用的页面，它将
    坏了，它被纺车卡住了。连接不会影响问题

  • 如果我删除了引用jQM样式表的行，那么页面将被删除 加载时不使用其样式，但图像加载正确（因此 对资产的引用正确）

请注意，纺车甚至不应该出现在第一位，因为我使用以下命令在jQM中完全禁用了AJAX：

<script>
$.mobile.ajaxEnabled = false;
</script>
我有一堆其他设置，但为了简化问题，我删除了它们，问题仍然存在

有什么建议吗

警察局。根据请求，发布index.html文件。这是最简单的示例，只是一个空索引。问题依然存在：

<!doctype html>
<html lang=es>
<head>
<meta charset="utf-8">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-touch-fullscreen" content="yes">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="format-detection" content="telephone=no" />
<meta name="HandheldFriendly" content="true" />
<meta name="MobileOptimized" content="320" />
<head>
<title>
    My title
</title>

<script>
$.mobile.ajaxEnabled = false;
</script>

<script src="script/jquery/jquery-1.9.1.min.js"></script>
<script src="script/jquery/jquery.mobile-1.3.2.min.js"></script>
<link href="css/jquery.mobile-1.3.2.min.css" rel="stylesheet" media="screen" type="text/css"  />


</head>

<body>

</body>
</html>


我的头衔
$.mobile.ajaxEnabled=false；
我自己解决了。事实证明，在JellyBean上，webView设置包含一个用于禁用从文件资源加载的属性，默认情况下是禁用的

在pre-Jelly设备上运行我的应用程序效果很好，但我用于开发的两台设备都基于4.3

如果有人感兴趣，我使用以下代码解决了它：

    if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN){
        s.setAllowUniversalAccessFromFileURLs(true);
        s.setAllowFileAccessFromFileURLs(true);
    }
避免使用
WebView.pauseTimers（）

或者，当包含WebView的活动调用
onResume（）
时，请尝试
WebView.resumeTimers（）
，感谢Gabriel Sanmartin。我也遇到过类似的情况，但我使用的是常规jQuery，而不是mobile，并调用.load（）函数将本地部分html文件加载到div中，如下所示：

var divNew = document.createElement('div');
var $divNew = $(divNew);
var sFilePath = sSubfolder + '/' + 'Index.html';
$divNew.load(sFilePath, function (response, status, xhr) {
    if (status == "error") {

    }
});
我花了将近半天的时间来调试JS代码，直到我发现了这个线程。找到这两种环境真是太棒了。这完全不同。我的C#代码如下：

if (Android.OS.Build.VERSION.SdkInt >= Android.OS.BuildVersionCodes.JellyBean)
{
      wbView.Settings.AllowUniversalAccessFromFileURLs = true;
      wbView.Settings.AllowFileAccessFromFileURLs = true;
}
供参考：
Android.OS.BuildVersionCodes.JellyBean被推荐为Android.OS.Build.VERSION\u CODES。JellyBean已过时，将在将来的版本中删除。

请显示index.html1的代码刚刚发布了一个简化版本，其中问题仍然存在。我刚刚发现注释jQM css行会导致页面加载（但显然没有样式），所以这似乎是一个与css相关的问题，我找不到使用API 12在JellyBean上运行的方法…你是如何使用préJelly API在pre Jelly上实现这一点的？谢谢。在我的例子中：它工作得很好。我只是s.setAllowUniversalAccessFromFileURLs（true），它一直工作到Android 5.1。我变得很疯狂。这个s.setAllowFileAccessFromFileURLs（true）保存了我的生活！谢谢 
if (Android.OS.Build.VERSION.SdkInt >= Android.OS.BuildVersionCodes.JellyBean)
{
      wbView.Settings.AllowUniversalAccessFromFileURLs = true;
      wbView.Settings.AllowFileAccessFromFileURLs = true;
}