Android与h5交互（一）对话框形式调用js

最新推荐文章于 2025-07-15 10:32:47 发布

原创最新推荐文章于 2025-07-15 10:32:47 发布 · 477 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#Android与H5交互

android开发同时被 2 个专栏收录

18 篇文章

订阅专栏

1 篇文章

订阅专栏

这篇博客介绍了一个Android应用与HTML5交互的简单Demo，重点在于如何在Android中通过WebView调用JS实现对话框功能。内容包括将HTML文件放入assets文件夹，创建基本布局，以及在Java代码中实现交互逻辑。

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

今天给大家写了一个简单的小dome android与js交互（一）我在这里说明一下不是我的原创我也是从网上找的给大家演练一下，好了进入正题吧

首先我给大家看的是我从网上随便复制的一串html文件首先这个文件是要放到你项目中main的文件夹中assets文件里（没有的话自己创建一个assets文件夹切记：一定是要放到main文件下的assets文件夹中）

<html>

<head>
    <meta charset="utf-8">
    <title>Carson_Ho</title>

    <!--// JS代码-->
    <script>
<!--// Android需要调用的方法-->
   function callJS(){
      alert("Android调用了JS的callJS方法");
   }
</script>

</head>

</html>

接下来我们就要写个布局了当咱们一听Android与H5交互立刻想到了Android中的控件WebView 接下来看一下我写的布局界面比较丑陋只不过是方便测试

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.bwp.jsjiaohu.MainActivity"
    android:background="#ffffff"
    >
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        >
    <Button
        android:id="@+id/mBtn"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="调用js" />


        <WebView
            android:id="@+id/mWeb"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            />

    </LinearLayout>


</LinearLayout>

接下来布局写好后我们开始在java代码中完成我们想要的功能,直接看代码吧该注意的地方我会用红色特别标注

public class MainActivity extends AppCompatActivity implements View.OnClickListener {
    private Button mBtn;
    private WebView mWeb;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
    }

    private void initView() {
        mBtn = (Button) findViewById(R.id.mBtn);
        mWeb = (WebView) findViewById(R.id.mWeb);

        mBtn.setOnClickListener(this);

        WebSettings WebSettings = mWeb.getSettings();
        WebSettings.setJavaScriptEnabled(true);// 设置与Js交互的权限
        WebSettings.setJavaScriptCanOpenWindowsAutomatically(true);//设置允许弹出js弹窗
        mWeb.loadUrl("file:///android_asset/javascript.html");//// 先载入JS代码 格式规定为:file:///android_asset/文件名.html
    }

    @Override
    public void onClick(View v) {
        mWeb.post(new Runnable() { // 通过Handler发送消息
            @Override
            public void run() {
                mWeb.loadUrl("javascript:callJS()");
                // 注意调用的JS方法名要对应上
                // 调用javascript的callJS()方法
            }
        });

        // 由于设置了弹窗检验调用结果,所以需要支持js对话框
        // webview只是载体，内容的渲染需要使用webviewChromClient类去实现
        // 通过设置WebChromeClient对象处理JavaScript的对话框
        //设置响应js 的Alert()函数


        mWeb.setWebChromeClient(new WebChromeClient() {
            @Override
            public boolean onJsConfirm(WebView view, String url, String message, final JsResult result) {
                AlertDialog.Builder b = new AlertDialog.Builder(MainActivity.this);
                b.setTitle("AlertDialog");
                b.setMessage(message);
                b.setPositiveButton(android.R.string.ok, new DialogInterface.OnClickListener() {
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
                        result.confirm();
                    }
                });
                b.setCancelable(false);
                b.create().show();
                return true;
            }
        });
    }
}