Android WebView中使用jQuery自动点击指定data-stage按钮

嘿，这个需求其实很好实现，核心就是利用WebView的JavaScript交互能力，等页面加载完成后注入一段JS代码去定位并点击目标按钮。下面是具体的步骤和代码示例：

1. 配置WebView基础设置 #

首先得确保你的WebView启用了JavaScript，这是执行后续操作的前提。同时要设置WebViewClient来监听页面加载完成的事件：

WebView webView = findViewById(R.id.your_webview_id);
WebSettings webSettings = webView.getSettings();
// 启用JavaScript
webSettings.setJavaScriptEnabled(true);
// 开启DOM存储，适配部分动态页面的需求
webSettings.setDomStorageEnabled(true);

2. 编写触发点击的JavaScript代码 #

我们需要一段JS来找到带有data-stage="premium"属性的按钮，然后模拟点击。为了避免元素不存在时抛出错误，最好加个判断：

const premiumButton = document.querySelector('button[data-stage="premium"]');
if (premiumButton) {
    premiumButton.click();
    console.log("Premium按钮已自动点击");
} else {
    console.log("未找到Premium按钮");
}

3. 在页面加载完成后执行JS #

通过WebViewClient的onPageFinished方法，在页面完全加载后调用evaluateJavascript执行上面的JS代码：

webView.setWebViewClient(new WebViewClient() {
    @Override
    public void onPageFinished(WebView view, String url) {
        super.onPageFinished(view, url);
        // 拼接自动点击的JS代码，注意转义双引号
        String jsCode = "const premiumButton = document.querySelector('button[data-stage=\"premium\"]'); if (premiumButton) { premiumButton.click(); console.log('Premium按钮已自动点击'); } else { console.log('未找到Premium按钮'); }";
        view.evaluateJavascript(jsCode, new ValueCallback<String>() {
            @Override
            public void onReceiveValue(String value) {
                // 这里可以接收JS执行的返回结果，方便调试
                Log.d("WebViewJS", "JS执行结果: " + value);
            }
        });
    }
});

// 最后加载目标网页
webView.loadUrl("你的目标网页URL");

4. 处理动态加载的页面（可选） #

如果你的目标页面是动态渲染的（比如按钮是通过AJAX或者前端框架异步加载出来的），onPageFinished可能会在按钮还没出现时就触发，导致找不到元素。这种情况下，你可以用MutationObserver来监听DOM变化，直到按钮出现再执行点击：

把下面的JS代码放到onPageFinished里执行：

// 创建MutationObserver监听DOM变化
const observer = new MutationObserver((mutations) => {
    const premiumButton = document.querySelector('button[data-stage="premium"]');
    if (premiumButton) {
        premiumButton.click();
        console.log("Premium按钮已自动点击");
        observer.disconnect(); // 找到目标后停止监听，避免重复触发
    }
});

// 监听整个body的子节点变化，包括嵌套的子元素
observer.observe(document.body, {
    childList: true,
    subtree: true
});

注意事项 #

• 确保你的WebView已经添加到布局文件中，并且有对应的ID。
• 如果加载的是在线网页，别忘了在AndroidManifest.xml中添加网络权限：<uses-permission android:name="android.permission.INTERNET" />
• evaluateJavascript是API 19及以上才支持的，如果要兼容更低版本，可以用loadUrl("javascript:你的代码")，但前者更安全且能接收返回值。

内容的提问来源于stack exchange，提问作者dotGitignore