標籤：ring 支援 setting test on() art android中 oct tag
hybrid App開發也不是什麼新鮮事了，其中native和h5之間的互動則是必不可少的。Android中是如何和H5互動的？1、webView載入頁面我們都知道在Android中是通過webView來載入html頁面的，根據HTML檔案所在的位置不同寫法也不同：
//例如：載入assets檔案夾下的test.html頁面mWebView.loadUrl("file:///android_asset/test.html")//例如：載入網頁mWebView.loadUrl("http://www.baidu.com")如果只是這樣調用mWebView.loadUrl()載入的話,那麼當你點擊頁面中的連結時，頁面將會在你手機預設的瀏覽器上開啟。那如果想要頁面在App內中開啟的話，那麼就得設定setWebViewClient：
mWebView.setWebViewClient(new WebViewClient() { @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { mWebView.loadUrl(url); return true; } } });想要調用js方法那麼就必須讓webView支援
WebSettings webSettings = mWebView.getSettings(); //設定為可調用js方法 webSettings.setJavaScriptEnabled(true);若調用的js方法沒有傳回值，則直接可以調用mWebView.loadUrl("javascript:do()");其中do是js中的方法；若有傳回值時我們可以調用mWebView.evaluateJavascript()方法：
mWebView.evaluateJavascript("sum(1,2)", new ValueCallback<String>() { @Override public void onReceiveValue(String value) { Log.e(TAG, "onReceiveValue value=" + value); } });js代碼如下：
<script type="text/javascript"> function sum(a,b){ return a+b; } function do(){ document.getElementById("p").innerHTML="hello world"; }</script>在Android4.2以上可以直接使用@JavascriptInterface註解來聲明，下面是在一個本地Java方法
public class JsInteration { @JavascriptInterface public String back() { return "hello world"; }}定義完這個方法後再調用mWebView.addJavascriptInterface()方法：
mWebView.addJavascriptInterface(new JsInteration(), "android");那麼在js中怎麼來調用呢？
<script type="text/javascript"> function s(){ //調用Java的back()方法 var result =window.android.back(); document.getElementById("p").innerHTML=result; }</script>mWebView.setWebViewClient(new WebViewClient() { @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { //判斷url攔截事件 if (url.equals("file:///android_asset/test2.html")) { Log.e(TAG, "shouldOverrideUrlLoading: " + url); startActivity(new Intent(MainActivity.this,Main2Activity.class)); return true; } else { mWebView.loadUrl(url); return false; } } });public class MainActivity extends AppCompatActivity {public static final String TAG = "MainActivity";private WebView mWebView;@Overrideprotected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mWebView = (WebView) findViewById(R.id.webView); mWebView.loadUrl("file:///android_asset/test.html"); WebSettings webSettings = mWebView.getSettings(); webSettings.setJavaScriptEnabled(true); mWebView.addJavascriptInterface(new JsInteration(), "android"); mWebView.setWebViewClient(new WebViewClient() { @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { if (url.equals("file:///android_asset/test2.html")) { Log.e(TAG, "shouldOverrideUrlLoading: " + url); startActivity(new Intent(MainActivity.this,Main2Activity.class)); return true; } else { mWebView.loadUrl(url); return false; } } });}//Android調用有傳回值js方法@TargetApi(Build.VERSION_CODES.KITKAT)public void onClick(View v) { mWebView.evaluateJavascript("sum(1,2)", new ValueCallback<String>() { @Override public void onReceiveValue(String value) { Log.e(TAG, "onReceiveValue value=" + value); } });}public class JsInteration { @JavascriptInterface public String back() { return "hello world"; }}}<!DOCTYPE html><html><head><title></title><script type="text/javascript"> function sum(a,b){ return a+b; } function s(){ var result =window.android.back(); document.getElementById("p").innerHTML=result; } </script></head><body><button onclick="s()">調用本地方法</button><a href="file:///android_asset/test2.html">點擊</a><p id="p"></p></body></html>Android和H5互動-基礎篇
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
