上一篇博客 Android-WebView与本地HTML (HTML调用-->Java的方法) 介绍了 JavaScript 调用--> Java中的方法,而此篇博客是介绍 Java 调用---> JavaScript中的方法
上上一篇博客 Android-WebView加载网络图片&网页 介绍了 使用WebView去加载网络上的图片与网页;
此篇博客专门介绍 Android-WebView与本地HTML (HTML调用-->Java的方法), 其实对于WebView来说 无论是本地HTML 还是 网络HTML ,代码操作方式都是相似的,只是loadUrl(1.网络链接 或 2.本地链接)
Java 调用 ---> JavaScript的方法:
Activity:
package cn.h5; import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.webkit.WebView;
import android.widget.EditText; public class MainActivity4 extends Activity { private EditText etName;
private WebView webView; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState); setContentView(R.layout.activity_main4); etName = findViewById(R.id.et_name); /**
* 定义此WebView 用于去展现本地HTML
*/
webView = findViewById(R.id.wv_webview); /**
* WebView默认是不能够执行javascript
* 以下代码是设置>>允许webview能够执行javascript代码
*/
webView.getSettings().setJavaScriptEnabled(true); // 这里不需要设置 webView.addJavascriptInterface,是因为JavaScript不调用-->Java的方法 /**
* 加载本地的HTML文件
*/
webView.loadUrl("file:///android_asset/test2.html");
} /**
* Button onClick 添加名字
* @param view
*/
public void addName(View view) { /**
* 让WebView去执行JavaScript代码
* 让WebView去执行JavaScript的my_function方法
*
* JavaScript方法:
* function my_function(myname) {
* document.getElementById("demo").innerHTML = "Java设置我的值名字是:" + myname;
* }
*/
webView.loadUrl("javascript:my_function(" + etName.getText().toString() + ")");
}
}
activity的布局:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"> <LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"> <EditText
android:id="@+id/et_name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:hint="请输入给JS的名字"
/> <Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="添加"
android:onClick="addName"
/> </LinearLayout> <!--
定义WebView
1.WebView可以展现处理本地的HTML相关;
2.WebView可以展现处理网络的HTML相关;
3.WebView可以制作自定义浏览器;
....
-->
<WebView
android:id="@+id/wv_webview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="60dp">
</WebView> </LinearLayout>
test2.html:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <!-- viewport的宽度等于设备宽度,viewport会根据屏幕宽度自动适应,并且对图片和文字进行缩放显示 -->
<meta name="viewport" content="initial-scale=1.0" /> <title>Web页面</title> <script type="text/javascript"> function my_function(myname) {
document.getElementById("demo").innerHTML = "Java设置我的值名字是:" + myname;
} </script> </head> <body> 这是一个html页面,现在在WebView中运行 <p id = "demo"></p> </body> </html>