當時業務的需求是這樣的，H5有一個活動商品清單的界面，IOS和Android共用這一個界面，點選商品可以跳轉到Android原生的商品詳情界面并傳遞商品ID； 大概就是點選H5界面跳轉到Android原生界面；
好了，需求已經分析完畢了，Android隻需要擷取H5的點選事件和傳遞的參數；
來，上代碼：
/啟用支援javascript
WebSettings settings = webView.getSettings();
settings.setJavaScriptEnabled(true);
Android4.2以上需要@JavascriptInterface注解，其目的是為了安全；
public class JavaScriptObject{
public JavaScriptObject(Activity activity) {
}
@JavascriptInterface
public void setToken(String token){
//token就是商品的ID，這裡拿到商品的ID後直接跳轉到商品詳情頁，并把id傳遞過去
}
@JavascriptInterface
public void definedShare(String ShareJson){
}
}
webView.addJavascriptInterface(new JavaScriptObject(this), "android");
到這裡Android端需要寫的就完成了；
這個是我截的圖，可以看一下：
這裡是H5需要寫的代碼：
function s(){
//調用Android的setToken()方法
var result =window.android.setToken(goodsId);
document.getElementById("p").innerHTML=result;
}
----------------------------------------------------------------------------------------------------------------------------------
附：如果在Android端調用H5中的方法：
//傳固定字元串可以直接用單引号括起來
mWebView.loadUrl("javascript:alertMessage('哈哈')");//通路H5裡帶參數的方法，alertMessage(message)為H5裡的方法
//當出入變量名時，需要用轉義符隔開
String content="1016";
mWebView.loadUrl("javascript:alertMessage(\"" +content+ "\")" );
//Android調用有傳回值js方法，安卓4.4以上才能用這個方法
mWebView.evaluateJavascript("11", new ValueCallback() {
@Override
public void onReceiveValue(String value) {
Log.i(TAG, "js傳回的結果為=" + value);
}
});
抽成方法：
private void callJS(String callback, String status) {
if (TextUtils.isEmpty(status)) {
if (AndroidUtils.isKitkat()) {
mWebView.evaluateJavascript("javascript:" + callback + "()", null);
} else {
mWebView.loadUrl("javascript:" + callback + "()");
}
} else {
if (AndroidUtils.isKitkat()) {
mWebView.evaluateJavascript("javascript:" + callback + "('" + status + "')", null);
} else {
mWebView.loadUrl("javascript:" + callback + "('" + status + "')");
}
}
}
JS與APP原生控件互動
"熱更新"."熱部署"相信對于混合式開發的童鞋一定不陌生,那麼APP怎麼避免每次更新都要在APP應用商店釋出呢?這裡就用到了混合式開發的概念,對于電商網站尤其顯 ...
基于H5的混合開發介紹(一)WebView
轉自: https://www.cnblogs.com/sanchang/p/9261461.html 一 WebView到底是什麼 1 WebView是一種控件,它基于webkit引擎,是以具 ...
Hybrid小程式混合開發之路 - 資料互動
HTML+CSS是曆史悠久.超高自由度.控制精準.表現能力極強.編碼簡單.學習門檻超低.真跨平台的一種UI界面開發方式. 本文介紹的是微信小程式和H5混合開發的一種資料互動方式. 很多應用在原生界面中 ...
移動web、webApp、混合APP、原生APP、androd H5混合開發 當無網絡下，android怎麼加載H5界面
PhoneGap是一個采用HTML,CSS和JavaScript的技術,建立移動跨平台移動應用程式的快速開發平台.它使開發者能夠在網頁中調用IOS,Android,Palm,Symbian,WP7,W ...
Android中Native和H5互動
1.概述 時至今日,H5的跨平台性越發凸顯優勢,一套代碼适配android.ios,既能減少開發成本,又便于更新與維護.但是native的性能體驗也确實更佳,尤其展現在複雜界面和頻繁變化的界面上.事實 ...
Android WebView 基本設定與H5 互動
mWebView.setDrawingCacheEnabled(true); WebChromeClient webChromeClient = new WebChromeClient(); mWeb ...
用戶端相關知識學習(三)之Android原生與H5互動的實作
Android原生與H5互動的實作 H5調用原生的方式 方式可能有多種,根據開發經驗,接觸過兩種方式. 方法一:Android向H5注入全局js對象,也就是H5調Android 1.首先對WebVie ...
Android與H5互動
1.初始化WebView控件 webView = (WebView) findViewById(R.id.webview); 2.設定WebView屬性 WebSettings webSettings ...
Android與H5互動(java與js的互動)
一.理論概述 1.js調用java方法 直接調用WebView的該方法就可以添加接口了,不過先要啟動互動 // 啟用javascript mWebView.getSettings().setJavaS ...
随機推薦
jsp頁面常用控件
1.點選按鈕傳回 上一頁: