Android——js交互实现点击弹框

1.在main文件夹下创建assets文件夹导入html文件

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Carson_Ho</title>
    // JS代码
    <script>
// Android需要调用的方法
   function callJS(){
     alert("Android调用了JS的callJS方法");
   }
</script>
</head>
</html>

2.布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <WebView
        android:id="@+id/webview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"></WebView>
    <Button
        android:id="@+id/button"
        android:text="点我调用js"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >
    </Button>

</LinearLayout>

3.实现

public class Frag_02 extends Fragment implements com.smq.zk3.view.View {

    private Presenter presenter;
    private WebView webView;

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view=inflater.inflate(R.layout.frag_02,container,false);
        presenter = new Presenter(this);
        presenter.onRelated();
        
        
        webView = view.findViewById(R.id.webview);
        Button button=view.findViewById(R.id.button);
        WebSettings webSettings = webView.getSettings();
        webSettings.setJavaScriptEnabled(true);
        webView.loadUrl("file:///android_asset/info.html");
        webView.addJavascriptInterface(new Jsinterface(), "android");
        webView.setWebChromeClient(new WebChromeClient(){
            @Override
            public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
                return super.onJsAlert(view, url, message, result);
            }
        });
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                webView.loadUrl("javascript:callJS()");
            }
        });


        return view;
    }

    private class Jsinterface {
        /**
         * 注意这里的@JavascriptInterface注解, target是4.2以上都需要添加这个注解,否则无法调用
         * @param text
         */
        @JavascriptInterface
        public void showToast(String text){
            Toast.makeText(getContext(), text, Toast.LENGTH_SHORT).show();
        }
        @JavascriptInterface
        public void showJsText(String text){
            webView.loadUrl("javascript:jsText('"+text+"')");
        }
    }

    @Override
    public void getViewData(String json) {

    }

    @Override
    public void onDestroy() {
        super.onDestroy();
        presenter.deatchView();
        webView.destroy();
    }
}

效果:Android——js交互实现点击弹框