Android 与 JS 的交互 以及 JS与Android 的交互
生活随笔
收集整理的這篇文章主要介紹了
Android 与 JS 的交互 以及 JS与Android 的交互
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
Android與JS交互以及JS與Android 的交互?是通過WebView互相調用方法?
對于Android調用JS代碼的方法有2種：
通過WebView的loadUrl（）
通過WebView的evaluateJavascript（）
2中方法對比
對于JS調用Android代碼的方法有3種：
通過WebView的addJavascriptInterface（）進行對象映射
通過 WebViewClient 的shouldOverrideUrlLoading ()方法回調攔截 url
通過 WebChromeClient 的onJsAlert()、onJsConfirm()、onJsPrompt（）
方法回調攔截JS對話框alert()、confirm()、prompt（） 消息
3中方法對比
具體代碼
WebView的loadUrl（）的方法
先寫一個test.html?
<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title>Android調用js</title><script>function call(){alert("Android調用了JS的callJS方法");}</script><style>.mytest{margin-top:50px;}</style></head><body>
<button onclick="call()" class="mytest">我是js我調用自己的彈框方法</button>
</body></html>在寫一個布局文件
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"><Buttonandroid:id="@+id/button"android:layout_width="match_parent"android:layout_height="wrap_content"android:text="Android調用js的方法loadUrl" /><WebViewandroid:id="@+id/load_url_web"android:layout_width="match_parent"android:layout_height="match_parent" /></FrameLayout>Activity 調用
public class LoadUrlActivity extends AppCompatActivity {private WebView webView;private Button button;@SuppressLint("SetJavaScriptEnabled")@Overrideprotected void onCreate(@Nullable Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.load_url_activity_layout);button = findViewById(R.id.button);webView = findViewById(R.id.load_url_web);WebSettings webSettings = webView.getSettings();// 設置與Js交互的權限webSettings.setJavaScriptEnabled(true);// 設置允許JS彈窗webSettings.setJavaScriptCanOpenWindowsAutomatically(true);webView.setWebChromeClient(new WebChromeClient());// 先載入JS代碼// 格式規定為:file:///android_asset/文件名.htmlwebView.loadUrl("file:///android_asset/test.html");button.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {webView.post(new Runnable() {@Overridepublic void run() {//call 為html里面的方法webView.loadUrl("javascript:call()");}});}});}
}WebView的evaluateJavascript（）
還是上面的html 布局也一樣,下面看下代碼
public class EvaluateJavascriptActivity extends AppCompatActivity {private WebView webView;private Button button;@SuppressLint("SetJavaScriptEnabled")@Overrideprotected void onCreate(@Nullable Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.evaluate_javascript_activity_layout);button = findViewById(R.id.button);webView = findViewById(R.id.evaluate_js_web);WebSettings webSettings = webView.getSettings();// 設置與Js交互的權限webSettings.setJavaScriptEnabled(true);// 設置允許JS彈窗webSettings.setJavaScriptCanOpenWindowsAutomatically(true);webView.setWebChromeClient(new WebChromeClient());// 先載入JS代碼// 格式規定為:file:///android_asset/文件名.htmlwebView.loadUrl("file:///android_asset/test.html");button.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {webView.post(new Runnable() {@Overridepublic void run() {//evaluateJavascript 要求android 大于sdk4.4if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {webView.evaluateJavascript("javascript:call()", new ValueCallback<String>() {@Overridepublic void onReceiveValue(String value){//此處為 js 返回的結果}});}}});}});}
}js 調用Android
1 寫一個addjs.html 文件如下
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>js調用android</title><script>function call(){test.main("js調用了android中的main方法");}</script></head><body><button type="button" id="button" onclick="call()">點擊調用android代碼</button></body>
</html>2 activity
public class EvaluateJavascriptActivity extends AppCompatActivity {private WebView webView;private Button button;@SuppressLint("SetJavaScriptEnabled")@Overrideprotected void onCreate(@Nullable Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.evaluate_javascript_activity_layout);button = findViewById(R.id.button);webView = findViewById(R.id.evaluate_js_web);WebSettings webSettings = webView.getSettings();// 設置與Js交互的權限webSettings.setJavaScriptEnabled(true);// 設置允許JS彈窗webSettings.setJavaScriptCanOpenWindowsAutomatically(true);webView.setWebChromeClient(new WebChromeClient());// 先載入JS代碼// 格式規定為:file:///android_asset/文件名.htmlwebView.loadUrl("file:///android_asset/test.html");button.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {webView.post(new Runnable() {@Overridepublic void run() {//evaluateJavascript 要求android 大于sdk4.4if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {webView.evaluateJavascript("javascript:call()", new ValueCallback<String>() {@Overridepublic void onReceiveValue(String value){//此處為 js 返回的結果}});}}});}});}
}?
demo 參考 地址
?
感謝:https://blog.csdn.net/carson_ho/article/details/64904691
總結
以上是生活随笔為你收集整理的Android 与 JS 的交互 以及 JS与Android 的交互的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Android webview 加载的h
- 下一篇： Android 标签 (FlexboxL