android - CSS 和 JavaScript 在 Android WebView 中不起作用

Question

我的 MainActivity.java 文件如下所示:

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        String myUrl = "file:///android_asset/index.html";
        WebView view = (WebView) this.findViewById(R.id.webView);
        view.getSettings().setJavaScriptEnabled(true);
        view.getSettings().setDomStorageEnabled(true);
        view.getSettings().setSaveFormData(true);
        view.setWebChromeClient(new WebChromeClient());
        view.loadUrl(myUrl);
    }
}

现在，activity_main.xml 文件包含以下代码:

<WebView
        android:id="@+id/webView"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        tools:layout_editor_absoluteX="0dp"
        tools:layout_editor_absoluteY="0dp" />
</android.support.constraint.ConstraintLayout>

而且，在 html 页面 index.html 中，我一直在链接 CSS 和 JS 文件，如下所示:

<link rel="stylesheet" href="file:///android_asset/css/bootstrap.min.css">
<script src="file:///android_asset/js/popper.min.js"></script>

我看到的是 html 内容；但是，CSS 和 JavaScript 文件根本没有起作用。页面看起来很普通。我是 Android 的新手，我肯定在这里遗漏了一些重要的东西。

Answer 1

在 html 页面 index.html 中，使用 relative 到您的 html 的路径名 页面(不是 file:///android_asset)。

所以改变这个:

<link rel="stylesheet" href="file:///android_asset/css/bootstrap.min.css">
<script src="file:///android_asset/js/popper.min.js"></script>

对此:

<link type="text/css" rel="stylesheet" href="css/bootstrap.min.css"/>
<script type="text/javascript" src="js/popper.min.js"></script>

目录结构:

+---assets
¦   +---css
¦   +---js