Phonegap:InAppBrowser 插入CSS 文件

wil*_*lvv 4 css cordova inappbrowser

我正在尝试创建一个加载网站的应用程序,然后添加一些自定义 CSS 以将其调整为移动设备。

我正在使用 window.open 成功加载页面,并且在我调用 browser.insertCSS 的 loadstop 上有一个回调,这就是问题所在。

如果我做这样的事情:

browser.insertCSS({code:"body{background-color:red;}");
Run Code Online (Sandbox Code Playgroud)

样式应用正确。但是,如果我这样做:

browser.insertCSS({file:"mobile-style.css");
Run Code Online (Sandbox Code Playgroud)

并将相同的 CSS 添加到文件中,它不会被加载

我尝试了不同的路径(将文件放在 www 文件夹中,在 css 文件夹中,在与 JS 文件相同的文件夹中,并使用“./mobile-style.css”、“mobile-style.css”来引用它, "/www/mobile-style.css", "/mobile-style.css" 但它们似乎都没有正确加载文件。

我看到了另一篇文章,提供给 insertCSS() 的文件路径应该相对于什么?在那里问了同样的问题,但没有接受的答案(我已经尝试过那里的建议,但它不起作用)。

任何帮助将不胜感激。

谢谢

  • 将要

Alb*_*tio 6

您必须等到 inAppBrowser 页面加载完成。

您必须添加一个事件侦听器:

var inApp = window.open('mypage.html', '_blank', 'location=no');
inApp.addEventListener('loadstop', function(){
    inApp.insertCSS({
        file: 'inAppStyle.css'
    },onSuccess);
});
Run Code Online (Sandbox Code Playgroud)

已编辑

将此路径用于您的 android 项目 file:///android_asset/{ your folder}

信息:https : //github.com/apache/cordova-plugin-file/blob/master/doc/index.md#android-file-system-layout