Android开发中需要和HTML5交互的各自方法以及示例-Toy模板网

这篇具有很好参考价值的文章主要介绍了Android开发中需要和HTML5交互的各自方法以及示例。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

在 Android 开发中，我们通常使用 WebView 组件来加载和显示 HTML5 页面。要实现 Android 与 HTML5 的交互，我们需要使用 WebView 提供的 JavaScript 接口。

以下是 Android 与 HTML5 交互的常用方法及示例：

1: Android 调用 HTML5 中的 JavaScript 函数：

在 WebView 中设置 JavaScriptEnabled 为 true，然后使用 loadUrl() 方法调用 HTML5 中的 JavaScript 函数。

WebView webView = findViewById(R.id.webView);
webView.getSettings().setJavaScriptEnabled(true);

// 加载 HTML5 页面
webView.loadUrl("file:///android_asset/sample.html");

// 调用 HTML5 中的 JavaScript 函数
webView.loadUrl("javascript:alert('Hello from Android')");

2: HTML5 调用 Android 中的方法：

创建一个与 JavaScript 交互的类，并使用 @JavascriptInterface 注解为 HTML5 提供 Android 方法。

示例：

public class WebAppInterface {
    Context context;

    WebAppInterface(Context context) {
        this.context = context;
    }

    @JavascriptInterface
    public void showToast(String message) {
        Toast.makeText(context, message, Toast.LENGTH_SHORT).show();
    }
}

在 WebView 中添加 JavaScript 接口，并设置接口名称：

webView.addJavascriptInterface(new WebAppInterface(this), "Android");

在 HTML5 页面中调用 Android 方法：

<!DOCTYPE html>
<html>
<head>
    <title>Sample HTML</title>
    <script type="text/javascript">
        function callAndroidFunction() {
            Android.showToast("Hello from HTML5");
        }
    </script>
</head>
<body>
    <button onclick="callAndroidFunction()">Call Android Function</button>
</body>
</html>

3: Android 与 HTML5 双向交互：

在 HTML5 页面中添加一个按钮，点击按钮时调用 Android 方法，并在 Android 方法中调用 HTML5 中的 JavaScript 函数。

示例：

HTML5 页面（sample.html）：

<!DOCTYPE html>
<html>
<head>
    <title>Sample HTML</title>
    <script type="text/javascript">
        function showMessage(message) {
            alert(message);
        }
    </script>
</head>
<body>
    <button onclick="Android.callJavaScriptFunction()">Call JavaScript Function</button>
</body>
</html>

Android 代码：文章来源地址https://www.toymoban.com/news/detail-753629.html

public class MainActivity extends AppCompatActivity {
    private WebView webView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        webView = findViewById(R.id.webView);
        webView.getSettings().setJavaScriptEnabled(true);
        webView.addJavascriptInterface(new WebAppInterface(this), "Android");
        webView.loadUrl("file:///android_asset/sample.html");
    }

    public class WebAppInterface {
        Context context;

        WebAppInterface(Context context) {
            this.context = context;
        }

        @JavascriptInterface
        public void callJavaScriptFunction() {
            runOnUiThread(new Runnable() {
                @Override
                public void run() {
                    webView.loadUrl("javascript:showMessage('Hello from Android')");
                }
            });
        }
    }
}

到了这里，关于Android开发中需要和HTML5交互的各自方法以及示例的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！