场景

Android中使用WebView加载本地html并支持运行JS代码和支持缩放：

https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/118637633

在上面实现使用加载html显示之后，怎样进行互相调用方法和传递参数。

注：

博客：
https://blog.csdn.net/badao_liumang_qizhi
关注公众号
霸道的程序猿
获取编程相关电子书、教程推送与免费下载。

实现

Android中调用JS方法

首先在Android中新增一个按钮，并设置其点击事件

        //Android中调用JS方法Button button = findViewById(R.id.button);button.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {callJs();}});

点击事件中调用了callJs方法，然后再activity中实现该方法

    @SuppressLint("SetJavaScriptEnabled")public void callJs(){webView.loadUrl("javascript:toAndroidCall()");}

然后在JS中实现该方法

        //Android中调用JS方法function toAndroidCall(){alert("Android中调用JS方法成功");}

效果

 

如果要传递参数可以

    @SuppressLint("SetJavaScriptEnabled")public void callJs(){String message = "公众号:霸道的程序猿";webView.loadUrl("javascript:toAndroidCallWithParam('"+message+"')");}

然后在JS端

        //Android中调用JS方法-带参数function toAndroidCallWithParam(message){alert("Android中调用JS方法成功，收到参数:"+message);}

效果

 

JS中调用Android的方法

在Android中实现方法

    //JS调用Android方法@JavascriptInterfacepublic void jsCallAndroid(){Toast.makeText(this,"JS调用Android方法成功",Toast.LENGTH_LONG).show();}

要加注解，然后还需要给webView进行配置

        //增加JS接口webView.addJavascriptInterface(this,"badao");

增加一个JS接口

然后在JS中新增一个按钮

<button id="button" onclick="toCallAndroid()">JS调用Android方法</button>

并设置点击事件

        //JS中调用Android方法function toCallAndroid(){badao.jsCallAndroid();}

效果

 

 

如果要传递参数

    //JS调用Android方法-带参数@JavascriptInterfacepublic void jsCallAndroidWithParam(String message){Toast.makeText(this,"JS调用Android方法成功,收到参数:"+message,Toast.LENGTH_LONG).show();}

在JS中

        //JS中调用Android方法function toCallAndroidWithParam(){badao.jsCallAndroidWithParam("霸道的程序猿");}

效果

 

MainActivity完整代码

 

package com.badao.webviewdemo;import androidx.appcompat.app.AppCompatActivity;import android.annotation.SuppressLint; import android.os.Bundle; import android.view.View; import android.webkit.JavascriptInterface; import android.webkit.WebChromeClient; import android.webkit.WebView; import android.widget.Button; import android.widget.Toast;public class MainActivity extends AppCompatActivity {WebView webView = null;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);//获取webviewwebView = findViewById(R.id.webview);//设置为ChromeClinet 才能执行js代码WebChromeClient webChromeClient = new WebChromeClient();webView.setWebChromeClient(webChromeClient);//设置开启js支持webView.getSettings().setJavaScriptEnabled(true);// 是否支持缩放webView.getSettings().setSupportZoom(true);//加载本地html//webView.loadUrl("file:///android_asset/offLineTileMap.html");webView.loadUrl("file:///android_asset/demo.html");//Android中调用JS方法Button button = findViewById(R.id.button);button.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {callJs();}});//增加JS接口webView.addJavascriptInterface(this,"badao");}@SuppressLint("SetJavaScriptEnabled")public void callJs(){//webView.loadUrl("javascript:toAndroidCall()");String message = "公众号:霸道的程序猿";webView.loadUrl("javascript:toAndroidCallWithParam('"+message+"')");}//JS调用Android方法@JavascriptInterfacepublic void jsCallAndroid(){Toast.makeText(this,"JS调用Android方法成功",Toast.LENGTH_LONG).show();}//JS调用Android方法-带参数@JavascriptInterfacepublic void jsCallAndroidWithParam(String message){Toast.makeText(this,"JS调用Android方法成功,收到参数:"+message,Toast.LENGTH_LONG).show();} }

总结

以上是生活随笔为你收集整理的Android和JS之间互相调用方法并传递参数的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。