Android webview +javascript 未在 android 4.0.x,3.x 中显示输出

Posted

技术标签:

【中文标题】Android webview +javascript 未在 android 4.0.x,3.x 中显示输出【英文标题】:Android webview +javascript not showing output in android 4.0.x,3.x 【发布时间】:2013-06-26 22:37:26 【问题描述】:

这是我的主要活动

package com.example.mathjax_issues;

import android.os.Bundle;
import android.app.Activity;
import android.graphics.Bitmap;
import android.util.Log;
import android.view.Menu;
import android.webkit.WebResourceResponse;
import android.webkit.WebView;
import android.webkit.WebViewClient;

public class MainActivity extends Activity 


    private WebView webView;
    @Override
    protected void onCreate(Bundle savedInstanceState) 
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        webView=(WebView)findViewById(R.id.webView1);
        webView.getSettings().setjavascriptEnabled(true);
        webView.setWebViewClient(new MyWebViewClient());
        webView.loadUrl("file:///android_asset/MathJax/test/sample-asciimath.html");
//      String html="<!DOCTYPE html> <html> <head> <title>MathJax AsciiMath Test Page</title> <!-- Copyright (c) 2012-2013 The MathJax Consortium --> <meta http-equiv=\"Content-Type\" content=\"text/html; charset=UTF-8\" /> <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\" /> <script type=\"text/javascript\" src=\"file:///android_asset/MathJax/MathJax.js?config=AM_HTMLorMML-full\"></script> </head> <body> <p> When `a != 0`, there are two solutions to `ax^2 + bx + c = 0` and they are </p> <p style=\"text-align:center\"> `x = (-b +- sqrt(b^2-4ac))/(2a) .` </p> </body> </html> ";
//      Log.e("html",html);
//      webView.loadDataWithBaseURL("file:///android_asset/MathJax", html, "text/html","utf-8", "");
    

    @Override
    public boolean onCreateOptionsMenu(Menu menu) 
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    


    private class MyWebViewClient extends WebViewClient
    

        @Override
        public void onPageFinished(WebView view, String url) 
            // TODO Auto-generated method stub
            super.onPageFinished(view, url);
        

        @Override
        public void onPageStarted(WebView view, String url, Bitmap favicon) 
            // TODO Auto-generated method stub
            super.onPageStarted(view, url, favicon);
        




    




这是我的示例-asciimath.html

<!DOCTYPE html>
<html>
<head>
<title>MathJax AsciiMath Test Page</title>
<!-- Copyright (c) 2012-2013 The MathJax Consortium -->
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />

<script type="text/javascript" src="../MathJax.js?config=AM_HTMLorMML-full"></script>

</head>
<body>

<p>
When `a != 0`, there are two solutions to `ax^2 + bx + c = 0` and they are
</p>
<p style="text-align:center">
`x = (-b +- sqrt(b^2-4ac))/(2a) .`
</p>

</body>
</html>

下面是我的项目图片

在2.3.3,2.2,4.1.2,4.2.2最新版本编译这段代码时

我从源得到正确的输出

但是当我在 3.0,3.1 和 4.0.3,4.0.4 android 版本中编译相同的源代码时

我得到这样的错误输出

朋友请帮助我...我无法解决这个错误...我认为可能是javascript问题。希望你们给我一些想法

我在本地存储 mathjax .. 在资产中

提前致谢...

【问题讨论】:

在 [this post][1] [1] 中描述了解决您的问题:***.com/questions/17029780/… 所有给定的答案都不适合我 我已经尝试了所有但没有任何效果的朋友.. 我在我的应用程序中使用 MathJax 但是它太慢了,无论如何我可以让它更快地工作,也可以在 TextView 上渲染 Mathml。 ????? 【参考方案1】:

我遇到了类似的问题。我所做的是将所有 .js 文件复制到与 html 所在的目录相同的目录中,并添加如下。

<script type="text/javascript" src="MathJax.js"></script>

我知道这听起来有点愚蠢,但它确实有效。

如果这不起作用,请将 .js 文件复制到 html 文件本身中,然后像在标题中一样尝试:

<script type="text/javascript">
copy the whole MathJax.js and paste it here
</script>

【讨论】:

你找到答案了吗?以及据我所知,您的 js 文件未加载。您是否尝试在 HTML 文件本身中编写 javascript 函数。尝试在 body onload 上插入一个 alert() ,这使您可以稍微暂停该过程,从而有时间加载您的 JS 文件。让我知道.. 我写了但没有加载 它是否使用任何 jquery 库..?你有没有加载它...?你有没有尝试在身体负载上发出警报。您是否在底部的 MathJax.js 中插入了警报。所以你可以看到在 jquery 之前是否加载了 htmL .. 我花了 2 天时间来完成这项工作 1 年前.. 尝试插入警报 n 看看它失败的部分.. 在我的 html 中我没有使用 jquery @TonyStark 是的,抱歉,警报不起作用.. 您是否在 HTML 标头中编写了 MathJax.js 中的整个函数,例如:【参考方案2】:

有些人已经遇到过这个问题(实际上……很多人……)。

一个帖子(也是一个答案)引起了我的注意:https://***.com/a/7197748/1387484

在文档完全加载后,您似乎必须手动在 WebViewClient 中注入您的 Javascript 调用。我没有更多的解释,但也许你可以尝试这种方式!

【讨论】:

【参考方案3】:

问题似乎与这个 android 错误有关。如果您使用 url 参数引用文件,则会发生 HTTP 404(找不到文件),在您的情况下,将找不到脚本“MathJax.js?config=AM_HTMLorMML-full”,因此不会加载。

Overcoming Honeycomb and Ice Cream Sandwich’s Broken WebView URLs

<!-- hack for honeycomb & ICS -- first script tag will not load but it's -->
<!-- needed for proper MathJax initialisation - clean solution would be to -->
<!-- pass the init data "AM_HTMLorMML-full" in some other way to MathJax -->
<script type="text/javascript" src="../MathJax.js?config=AM_HTMLorMML-full"></script>
<script type="text/javascript" src="../MathJax.js"></script>

【讨论】:

【参考方案4】:

当脚本与 html 文件相比,它不在外部文件夹中时,它可以工作。

如果您从MathJax 文件夹中获取html 文件,并如下更改html 文件中的行,它将起作用。

&lt;script type="text/javascript" src="./MathJax/MathJax.js?config=AM_HTMLorMML-full"&gt;&lt;/script&gt;

当然还有把java文件改成webView.loadUrl("file:///android_asset/sample-asciimath.html");

【讨论】:

【参考方案5】:

问题是因为您必须在 html 文件中为 mathjax 设置配置 (AM_HTMLorMML-full.js)(将代码复制到您的文件),并且您必须指定 MathJax.js 文件的完整路径,就像下面的代码:

    <!DOCTYPE html>
    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
            <meta http-equiv="X-UA-Compatible" content="IE=edge">
           <script type="text/javascript" src="../MathJax/MathJax.js">
                MathJax.Hub.Config(
                    config: ["MMLorHTML.js"],
                    extensions: ["asciimath2jax.js","MathEvents.js","MathZoom.js","MathMenu.js","toMathML.js"],
    jax: ["input/AsciiMath","output/HTML-CSS","output/NativeMML"]
                );
                MathJax.Ajax.loadComplete("[MathJax]/config/AM_HTMLorMML-full.js");
           </script>
    </head>
    <body>
        <p>`\sqrt2x + 1`</p>
    </body>
    </html>

【讨论】:

以上是关于Android webview +javascript 未在 android 4.0.x,3.x 中显示输出的主要内容,如果未能解决你的问题,请参考以下文章

UEditor

Indexhibit手风琴菜单

初学react

javaska

JavaScript??????0-100????????????

JavaScript视图源