JS调用Java代码(Android)

最新推荐文章于 2024-07-29 03:37:22 发布

原创最新推荐文章于 2024-07-29 03:37:22 发布 · 1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#android #webview #js

android 同时被 3 个专栏收录

134 篇文章

订阅专栏

1 篇文章

订阅专栏

webview

1 篇文章

订阅专栏

本文详细介绍了如何通过HTML代码在网页上实现按钮点击事件，并通过JavaScript与Android应用进行交互，成功打开图片详情页面，展示了前端与后端、客户端与服务器之间数据传递与页面跳转的技术过程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

html代码

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>测试</title>
    <script type="text/javascript">
        function openDetailPage(){
            client.openDetailPage("{'ids':[16503, 16615, 8135, 7963],'pos':1}")
        }

    </script>
</head>
<body>
<br />
    <button onclick="openDetailPage()">openDetailPage</button>
</body>
</html>

Android中代码

1,接收传过来的信息类

class JsOperation {
        Activity mActivity;
        OnInfoPassedListener mListener;

        public JsOperation(Activity activity, OnInfoPassedListener listener) {
            mActivity = activity;
            this.mListener = listener;
        }

        //打开图片详情页面
        @android.webkit.JavascriptInterface
        public void openDetailPage(String info) {
            LogCus.d("JsOperation", "info>>>" + info);
            parseInfo(info);
        }

        private void parseInfo(String info) {
            LiveJsInfo liveInfo = JsonUtil.jsonToObj(info, LiveJsInfo.class);
            if (liveInfo != null && mListener != null) {
                mListener.infoPassed(liveInfo.pos, liveInfo.ids);
            } else {
                LogCus.w("JsOperation", "liveInfo == null");
            }
        }
    }

2,数据传过来后的回调函数

public interface OnInfoPassedListener{
        void infoPassed(int pos, int...photoIds);
    }

真正调用代码:

wvContainer.addJavascriptInterface(new JsOperation(this, new OnInfoPassedListener() {
            @Override
            public void infoPassed(int pos, int... photoIds) {
                LogCus.d("infoPassed", "photoIds>>" + Arrays.toString(photoIds) + "pos>>>" + pos);                
            }
        }), "client");