嘿，这个问题我刚好踩过坑！在Android WebView里处理系统返回键，光靠JS肯定不行——因为系统返回键是Android系统级的事件，WebView里的JS没法直接捕获它。不过只要让Android原生层和JS层配合一下，就能轻松实现自定义响应，我给你一步步讲：

系统返回键的触发事件只会先传到Android的Activity里，所以我们需要先在原生代码里拦截这个事件，再主动通知JS执行自定义逻辑。

第一步：Android原生代码拦截返回键 #

不管你用Kotlin还是Java，都要在WebView所在的Activity里重写onBackPressed()方法，把返回事件转发给JS。

Kotlin示例 #

override fun onBackPressed() {
    val webView = findViewById<WebView>(R.id.your_webview_id)
    // 先判断WebView是否有可返回的历史记录
    if (webView.canGoBack()) {
        // 通知JS执行自定义处理函数
        webView.evaluateJavascript("handleAndroidBackButton()", null)
    } else {
        // 如果WebView不能返回，执行默认的系统返回行为（比如退出页面）
        super.onBackPressed()
    }
}

Java示例 #

@Override
public void onBackPressed() {
    WebView webView = findViewById(R.id.your_webview_id);
    if (webView.canGoBack()) {
        // 通知JS执行自定义处理函数
        webView.evaluateJavascript("handleAndroidBackButton()", null);
    } else {
        super.onBackPressed();
    }
}

⚠️ 别忘了先给WebView启用JavaScript支持：

// Kotlin
webView.settings.javaScriptEnabled = true

// Java
webView.getSettings().setJavaScriptEnabled(true);

第二步：JS端编写自定义响应逻辑 #

在你的HTML/JS代码里，定义原生代码调用的handleAndroidBackButton()函数，写你想要的自定义行为就行：

function handleAndroidBackButton() {
    console.log("系统返回键被点击啦！");
    
    // 示例1：如果页面有弹窗，优先关闭弹窗
    const modal = document.getElementById("my-modal");
    if (modal && modal.style.display === "block") {
        modal.style.display = "none";
        return; // 终止后续逻辑，不让WebView返回
    }
    
    // 示例2：没有弹窗的话，让WebView返回上一页
    window.history.back();
    
    // 示例3：或者完全自定义跳转，比如回到首页
    // window.location.href = "/home.html";
}

进阶：让JS决定是否触发原生默认行为 #

如果想让JS灵活控制——比如某些场景下自己处理，某些场景下交给原生执行默认返回——可以给WebView添加一个JS接口，让JS主动通知原生。

原生端添加JS接口 #

Kotlin示例

class MyWebInterface(private val activity: Activity) {
    // 注解必须加，否则JS调用不了
    @JavascriptInterface
    fun backHandledByJs() {
        // 什么都不做，说明JS已经处理了返回事件
    }

    @JavascriptInterface
    fun triggerDefaultBack() {
        // 执行原生默认返回
        activity.onBackPressed()
    }
}

// 在初始化WebView的地方添加接口
webView.addJavascriptInterface(MyWebInterface(this), "AndroidBridge")

JS端调用接口

function handleAndroidBackButton() {
    const modal = document.getElementById("my-modal");
    if (modal && modal.style.display === "block") {
        modal.style.display = "none";
        // 告诉原生：我已经处理了，不用管
        AndroidBridge.backHandledByJs();
    } else {
        // 告诉原生：帮我执行默认返回
        AndroidBridge.triggerDefaultBack();
    }
}

小提示 #

• evaluateJavascript()是Android 4.4+才支持的API，如果要兼容更低版本，可以用webView.loadUrl("javascript:handleAndroidBackButton()")，不过前者更推荐，因为它支持异步获取JS的返回值。
• 如果你不需要自定义逻辑，只是想让WebView正常返回，直接在onBackPressed()里调用webView.goBack()就行，不用通知JS。

内容的提问来源于stack exchange，提问作者Ercan Tomaç