Android中WebView和JS交互之弹出框问题

        混合开发时,最常见的就是WebView和JS的交互操作,其中有一个操作就是JS的弹出框在Android的WebView中不能弹出问题,相信做过混合开发的童鞋都有遇到这个问题。因为默认情况下,Android WebView是不支持js的Alert(),Confirm(),Prompt()函数的弹出提示框的.即使设置了setJavaScriptEnabled(true);也是没用的.那么,如何才能让WebView可以支持js的这3个函数呢.可以通过设置WebChromeClient对象来完成.WebChromeClient主要辅助WebView处理Javascript的对话框、网站图标、网站title、加载进度等等.下面谈谈解决方案,首先还是放出效果图:

        这是html中的点击提交后的代码截图,下面是手机端涉及界面的弹出框效果图:

        好了,具体的解决方法:

        网络权限必须要有的:

<uses-permission android:name="android.permission.INTERNET" />

        然后是WebView配置允许和JS交互:

webSettings.setJavaScriptEnabled(true);
webSettings.setJavaScriptCanOpenWindowsAutomatically(true);
        再然后就是这里最重要的方法了:

webView.setWebChromeClient(new WebChromeClient(){
    @Override
    public boolean onJsAlert(WebView view, String url, final String message, final JsResult result) {

        new AlertOpeUtil(LookHelpActivity.this, new IAlertCallBack() {
            @Override
            public void onOkCallBack() {
                if(message.equals("提交成功!")){
                    finish();
                }else {
                    result.confirm();
                }
            }

            @Override
            public void onCancelBack() {

            }
        }).showDialog2("提示:",message);
        return true;
    }
    //设置响应js 的Confirm()函数
    @Override
    public boolean onJsConfirm(WebView view, String url, String message, final JsResult result) {
        new AlertOpeUtil(LookHelpActivity.this, new IAlertCallBack() {
            @Override
            public void onOkCallBack() {
                result.confirm();
            }

            @Override
            public void onCancelBack() {
                result.cancel();
            }
        }).showDialog("提示:",message);
        return true;
    }
    //设置响应js 的Prompt()函数
    @Override
    public boolean onJsPrompt(WebView view, String url, String message, String defaultValue, final JsPromptResult result) {
        final View v = View.inflate(LookHelpActivity.this, R.layout.prompt_dialog, null);
        ((TextView) v.findViewById(R.id.prompt_message_text)).setText(message);
        ((EditText) v.findViewById(R.id.prompt_input_field)).setText(defaultValue);
        AlertDialog.Builder b = new AlertDialog.Builder(LookHelpActivity.this);
        b.setTitle("Prompt");
        b.setView(v);
        b.setPositiveButton(android.R.string.ok, new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
                String value = ((EditText) v.findViewById(R.id.prompt_input_field)).getText().toString();
                //result.confirm(value);
            }
        });
        b.setNegativeButton(android.R.string.cancel, new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
               // result.cancel();
            }
        });
        b.create().show();
        return true;
    }
});

        三个重写的方法分别对应于JS中的alert(),confirm(),prompt()方法的处理。就是相当于把JS中的弹出框分别转换成了Android中的弹出框来处理。结束大笑

   


  • 3
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Android WebView 是一个能够在 Android 应用程序嵌入网页的组件,它可以开发出能够与 Web 页面进行交互的应用。其与 Web 页面进行交互的一种方法是与 JavaScript 进行交互。下面简要解释一下 Android WebViewJS 交互的方式。 1. 加载本地 HTML 文件 在 Android WebView 加载本地 HTML 文件时,需要使用 loadUrl() 方法加载。HTML 文件的 JavaScript 可以通过 WebView 提供的 addJavascriptInterface() 方法注册为 Java 的一个对象,然后在 Java 调用该对象的方法,即可实现 JS 与 Java 的交互。 2. 加载远程 Web 页面 在 Android WebView 加载远程 Web 页面时,需要添加 WebViewClient 和 WebChromeClient,分别是用来管理 WebView 的网络请求和处理页面上的 JavaScript 弹窗等请求。 在远程 Web 页面上,JS 代码可以通过 WebView 提供的 addJavascriptInterface() 方法注册为 Java 的一个对象,然后在 Java 调用该对象的方法,即可实现 JS 与 Java 的交互。 同时,在 Android 处理 JS 的事件需要通过 JavaScriptInterface 向 WebView 注册一个映射对象,来实现 JS、Java 相互调用的机制,静态 HTML 文件是通过 WebView 的 evaluateJavascript() 方法来调用 JS,来实现双向通信和数据交互。 总结来说,Android WebViewJS 交互的方式主要是通过 WebView 提供的 addJavascriptInterface() 方法注册为 Java 的一个对象,然后在 Java 调用该对象的方法,来实现 JS 和 Java 的交互。同时,JS 也可以通过 WebView 的 evaluateJavascript() 方法来调用 Java 的方法,实现双向通信和数据交互
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值