Android傳輸據(jù)給JS，首先在AndroidStudio中創(chuàng)建一個(gè)項(xiàng)目稚茅，在認(rèn)識(shí)目錄下創(chuàng)建一個(gè)文件夾為：assets 纸淮，之后將寫好的html界面放在這個(gè)目錄下，為了界面好看點(diǎn)亚享，我在該目錄下放了一個(gè)h5的代碼文件咽块，這里我為了方便就沒有將該html放在Tomcat上。下面是我的html代碼：
<!DOCTYPE html>
<html>
<head>
<title>Android調(diào)用js代碼</title>
</head>
<body>
用戶：<div id="name">游客</div>
<img src = "girl_14.jpg" width="350px"/>
<button id="but_click" onclick="show()" >點(diǎn)擊傳數(shù)據(jù)給Android</button>
<!-- JS調(diào)用Android原生方法 Android中的方法為showToast-->
<!--Android調(diào)用js方法 webView.loaduri("javascript:showUser('"+user+"','"+pswword+"'')") -->
<script type="text/javascript">
function showUser(user,psw) {
document.getElementById("name").innerHTML = user+"密碼："+psw;
alert(user+psw);
}
</script>
</body>
</html>
下面我在Android布局文件里添加WebView欺税，以及兩個(gè)輸入框侈沪，為了將賬戶數(shù)據(jù)傳遞給WebView中的h5界面:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<EditText
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="@+id/et_name"
/>
<EditText
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="@+id/et_psw"
/>
<Button
android:text="登錄"
android:layout_width="match_parent"
android:id="@+id/but_login"
android:layout_height="50dp"
/>
<WebView
android:id="@+id/wb"
android:layout_width="match_parent"
android:layout_height="match_parent">
</WebView>
</LinearLayout>
下面就是布局控件初始化，這里最重要的是對WebView的設(shè)置晚凿，并且將assets下的html文件加載進(jìn)來：
webView = (WebView) findViewById(R.id.wb);
webView.loadUrl("file:///android_asset/demo01.html");
webView.setWebChromeClient(new WebChromeClient());
//設(shè)置瀏覽器為Android自帶的瀏覽器
webView.addJavascriptInterface(new AndroidInterface(), "android");
WebSettings settings = webView.getSettings();
settings.setJavaScriptEnabled(true);//必須設(shè)置表示支持js
settings.setBuiltInZoomControls(true);
settings.setDefaultFontSize(20);
好了亭罪，下面就是當(dāng)點(diǎn)擊登錄按鈕時(shí)在Android中傳數(shù)據(jù)給h5：
user = name.getText().toString().trim();
password = psw.getText().toString().trim();
String login = "javascript:showUser('"+user+"','"+password+"')";
Log.e("q", "onClick: "+login );
webView.loadUrl(login);
好了，這樣h5中通過執(zhí)行js而使h5界面發(fā)生改變歼秽。
h5中數(shù)據(jù)通過js傳數(shù)據(jù)給Android
- 給h5中的按鈕添加點(diǎn)擊事件（js執(zhí)行）：
<button id="but_click" onclick="show()" >點(diǎn)擊傳數(shù)據(jù)給Android</button>
<script type="text/javascript">
function show(){
var msg = document.getElementById("name").innerText;
//alert(msg);
window.android.show(msg);
/**
*這里window是固定的 android是在你Android代碼中給WebView添加js接口的第二個(gè)數(shù)據(jù) show（msg）是Android中的調(diào)用的方法
*
*/
}
</script>
js中的代碼就是這樣应役，下面如何在h5中點(diǎn)擊后Android如何響應(yīng)，Android首先就是創(chuàng)建一個(gè)js需要調(diào)用的方法燥筷，根據(jù)webView.addJavascriptInterface(new AndroidInterface(), "android");這個(gè)設(shè)置知道創(chuàng)建的類為AndroidInterface類箩祥，所以創(chuàng)建一個(gè)非靜態(tài)內(nèi)部類，在該類中編寫一個(gè)在js中需要調(diào)用的方法：
class AndroidInterface{
public AndroidInterface(){
}
//由于在api17以后需要用注解申明肆氓，所以該方法必須添加下面的注解滥比，api17以前不用申明
@JavascriptInterface
public void show(String msg){
Toast.makeText(MainActivity.this, "Html傳過來數(shù)據(jù)了"+msg, Toast.LENGTH_SHORT).show();
}
}
好了，基本的js和android之間的交互就完成了做院，點(diǎn)擊查看源碼
