Android Naive與WebView的互相調(diào)用詳解
Android Naive與WebView的互相調(diào)用詳解
Android的Naive程序是可以嵌套WebView,并且可以做到與WebView的交互,一般來說有兩種方法,一是直接交互,比如,Naive直接調(diào)用WebView的方法和WebView直接調(diào)用Naive的方法。二是WebView可以寫<a/>超鏈接標(biāo)簽,然后用戶點(diǎn)擊此標(biāo)簽時(shí),Naive可以攔截到點(diǎn)擊標(biāo)簽的事件,這樣,我們可以在鏈接上做一套自己的協(xié)議,然后Android和iOS可以根據(jù)此協(xié)議做出相同的處理,做到多平臺(tái)統(tǒng)一。
我們先研究一下Naive和WebView如何相互調(diào)用。
初始化:
mWebView = (WebView) findViewById(R.id.main_wv); mWebView.getSettings().setJavaScriptEnabled(true); mWebView.loadUrl("file:///android_asset/demo.html"); //第一個(gè)為交給WebView來進(jìn)行控制的對(duì)象,第二個(gè)為控制的對(duì)象的變量名,即JS得到此對(duì)象后,在為此對(duì)象賦名,就可以進(jìn)行控制了。 mWebView.addJavascriptInterface(this, "naive");
1、Naive直接調(diào)用JS方法:
下面為html中的JS方法 :
function alert(){ document.getElementById("title").innerHTML = "Naive調(diào)用Js無參方法"; }
naive進(jìn)行調(diào)用,方式為調(diào)用WebView的loadUrl方法,方法中傳遞一個(gè)String,格式為'javascript:'+'方法名'+'(變量)'
public void onJs(View view) { mWebView.loadUrl("javascript:alert()"); }
有參數(shù)JS方法:
function alertWith(arg){ document.getElementById("title").innerHTML = arg; }
naive進(jìn)行有參JS調(diào)用:
public void onJsWith(View view) { mWebView.loadUrl("javascript:alertWith('Naive調(diào)用Js有參方法')"); }
2、JS調(diào)用naive:
本地先寫好要被調(diào)用的方法,注意前面需要加上注解@JavascriptInterface
@JavascriptInterface public void toast() { Toast.makeText(this, "JS調(diào)用了Naive的無參方法", Toast.LENGTH_SHORT).show(); }
JS調(diào)用的代碼:
<input type="button" value="點(diǎn)擊調(diào)用naive代碼" onclick="window.naive.toast()"/>
本地寫好有參的要被調(diào)用的方法:
@JavascriptInterface public void toastWith(String toast) { Toast.makeText(this, toast, Toast.LENGTH_SHORT).show(); }
js調(diào)用有參的代碼:
<input type="button" value="點(diǎn)擊調(diào)用naive代碼并傳遞參數(shù)" onclick="window.naive.toastWith('JS調(diào)用了Naive的有參代碼')"/>
下面將Activity的源代碼貼出來;
public class MainActivity extends AppCompatActivity { private WebView mWebView; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mWebView = (WebView) findViewById(R.id.main_wv); mWebView.getSettings().setJavaScriptEnabled(true); mWebView.addJavascriptInterface(this, "naive"); mWebView.loadUrl("file:///android_asset/demo.html"); } public void onJs(View view) { mWebView.loadUrl("javascript:alert()"); } public void onJsWith(View view) { mWebView.loadUrl("javascript:alertWith('Naive調(diào)用Js有參方法')"); } @JavascriptInterface public void toast() { Toast.makeText(this, "JS調(diào)用了Naive的無參方法", Toast.LENGTH_SHORT).show(); } @JavascriptInterface public void toastWith(String toast) { Toast.makeText(this, toast, Toast.LENGTH_SHORT).show(); } }
下面為HTML的代碼:
<html> <head> <meta http-equiv="Content-Type" content="text/html;charset=gb2312"> <script type="text/javascript"> function alert(){ document.getElementById("title").innerHTML = "Naive調(diào)用Js無參方法"; } function alertWith(arg){ document.getElementById("title").innerHTML = arg; } </script> </head> <body> <h1 id="title"></h1><br/> <input type="button" value="點(diǎn)擊調(diào)用naive代碼" onclick="window.naive.toast()"/><br/> <input type="button" value="點(diǎn)擊調(diào)用naive代碼并傳遞參數(shù)" onclick="window.naive.toastWith('JS調(diào)用了Naive的有參代碼')"/> </body> </html>
感謝閱讀,希望能幫助到大家,謝謝大家對(duì)本站的支持!
相關(guān)文章
Android實(shí)現(xiàn)把文件存放在SDCard的方法
這篇文章主要介紹了Android實(shí)現(xiàn)把文件存放在SDCard的方法,涉及Android針對(duì)SDCard的讀寫技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-09-09ActivityManagerService廣播并行發(fā)送與串行發(fā)送示例解析
這篇文章主要為大家介紹了ActivityManagerService廣播并行發(fā)送與串行發(fā)送示例解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-03-03Android ScrollView實(shí)現(xiàn)反彈效果的實(shí)例
這篇文章主要介紹了 Android ScrollView實(shí)現(xiàn)反彈效果的實(shí)例的相關(guān)資料,這里自定義scrollview 并實(shí)現(xiàn)反彈效果,需要的朋友可以參考下2017-07-07ActivityLifecycleCallbacks如何判斷APP是否在前臺(tái)
這篇文章主要為大家詳細(xì)介紹了ActivityLifecycleCallbacks判斷APP是否在前臺(tái)的方法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-07-07Android實(shí)現(xiàn)判斷某個(gè)服務(wù)是否正在運(yùn)行的方法
這篇文章主要介紹了Android實(shí)現(xiàn)判斷某個(gè)服務(wù)是否正在運(yùn)行的方法,涉及Android針對(duì)系統(tǒng)服務(wù)運(yùn)行狀態(tài)的判斷技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-10-10Flutter實(shí)現(xiàn)仿微信分享功能的示例代碼
Flutter 用來快速開發(fā) Android iOS平臺(tái)應(yīng)用,在Flutter 中,通過 fluwx或者fluwx_no_pay 插件可以實(shí)現(xiàn)微信分享功能,本文將具體介紹實(shí)現(xiàn)的示例代碼,需要的可以參考一下2022-01-01Android動(dòng)態(tài)添加menu菜單的簡(jiǎn)單方法
Android動(dòng)態(tài)添加menu菜單的簡(jiǎn)單方法,需要的朋友可以參考一下2013-06-06