由于公司需求,学习adroid使用webview开发
调用
js调用安卓
webView.addJavascriptInterface() WebViewClient.shouldOverrideUrlLoading()
安卓调用js
webView.loadUrl(); webView.evaluateJavascript()
简单案例解析js调用java
模板
MyHtml.html
<!DOCTYPE html>
<html>
<head>
<title>MyHtml.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script type="text/javascript">
function showToast(toast) {
javascript:control.showToast(toast);
}
function log(msg) {
consolse.log(msg);
}
</script>
</head>
<body>
<input type="button" value="toast" onclick="showToast('js调用java方法!')">
</body>
</html>
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<WebView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:id="@+id/webView"/>
</RelativeLayout>
MainActivity.java
package com.example.javajsinteractive;
import android.os.Bundle;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.app.Activity;
import android.util.Log;
import android.webkit.JavascriptInterface;
import android.widget.Toast;
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.webView);
WebSettings webSettings = webView.getSettings();
webSettings.setJavaScriptEnabled(true);
webView.addJavascriptInterface(new JsInterface(), "control");
webView.loadUrl("file:///android_asset/MyHtml.html");
}
public class JsInterface {
@JavascriptInterface
public void showToast(String toast) {
Toast.makeText(MainActivity.this, toast, Toast.LENGTH_SHORT).show();
Log.d("html", "show toast success");
}
public void log(final String msg) {
webView.post(new Runnable() {
@Override
public void run() {
webView.loadUrl("javascript log(" + "'" + msg + "'" + ")");
}
});
}
}
}
上述代码步骤:
获取webview控件
获取webview的设置,将javascript设置为可用,打开javascript的通道
此处在MainActivity.java中设置
在Android程序中建立接口,并编写相关逻辑
再去看之前js脚本中的showToast()方法
function showToast(toast) {
javascript:control.showToast(toast);
}
👆这里的control就是我们的那个interface,调用了interface的showToast方法,很明显这里是js调用了Android的代码,输出了一个Toast
webView.addJavascriptInterface(new JsInterface(), "control");
webView.loadUrl("file:///android_asset/MyHtml.html");
}
public class JsInterface {
@JavascriptInterface
public void showToast(String toast) {
Toast.makeText(MainActivity.this, toast, Toast.LENGTH_SHORT).show();
Log.d("html", "show toast success");
}
👆可以看到这个interface我们给它取名叫control,最后通过loadUrl加载页面。
public class JsInterface {
@JavascriptInterface
public void showToast(String toast) {
Toast.makeText(MainActivity.this, toast, Toast.LENGTH_SHORT).show();
Log.d("html", "show toast success");
}
可以看到先显示一个toast,然后调用log()方法,log()方法里调用了js脚本的log()方法, js的log()方法做的事就是在控制台输出msg,这里明显是Android调用了js的方法。
给webview添加我们自己编写的JavaScript接口
通过WebView的addJavascriptInterface方法去注入一个我们自己写的interface。
webView.addJavascriptInterface(new JsInterface(), "control");
使用webview控件加载html文件
webView.loadUrl("file:///android_asset/MyHtml.html");
f 在真实手机上运行程序,在控制台成功输出内容:
简单案例解析java调用js代码
<script>
function jsalert(data) {
alert(data);
}
</script>
webview.loadUrl('javascript:jsalert('111')')
|