问题描述

支付宝网页支付页面如上，默认页面为二维码扫描界面。 我现在有一个需求，在电视上显示一个扫码页面，方便用户扫码支付。 出现问题是因为网页是在移动设备上（只要系统自动识别为移动设备），就会自动切换。 到达登录页面。

问题探索

我们应该做什么？ 我们发现登录支付左侧有一个扫描支付按钮，所以我们首先尝试使用div的事件来处理。

经过

到场

所以我们输入了 me('-tip-btn')[0].(); 在浏览器控制台中发现确实达到了调整效果，相当费劲！ 有那么简单就能解决吗？ 不！ 很遗憾地告诉你我没有鸡蛋。

代码部分

@AfterViews void initViews() { WebSettings webSettings = wv_alipay.getSettings(); // 设置WebView属性，能够执行Javascript脚本 webSettings.setJavaScriptEnabled(true); webview.setWebViewClient(new MyWebViewClient()); webview.setWebChromeClient(new WebChromeClient()); webview.loadUrl(url); } private class MyWebViewClient extends WebViewClient { @Override public void onPageStarted(WebView view, String url, Bitmap favicon) { super.onPageStarted(view, url, favicon); showProgressDialog(getString(R.string.global_progress_loading)); } @Override public void onPageFinished(WebView view, String url) { view.getSettings().setJavaScriptEnabled(true); super.onPageFinished(view, url); //点击按钮 webview.loadUrl("javascript:document.getElementsByClassName('switch-tip-btn') [0].click()"); } @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { return false; } }

失败原因

为什么如此昂贵的方法会失败呢？ 事实上，我在 TV 终端 (.3) 上执行了一次，在模拟器 (.0) 上执行了一次。 这并不是完全失败，电视上没有任何反应，但在模拟器上却可以。 显然，和版本有关系，所以我快速浏览了一下各个历史版本的底层内核，发现：

4.4以下的版本（不包括4.4）都是内核ps：这简直就是一个陷阱。 4.4版本被内核取代。 5.0版本引入了当时的最新版本，并增加了安全性和稳定性。

我这里就不详细说了。 可以参考各个版本的分析和试用方法。

我们首先想一个基于网页实现的解决方案。 我们发现4.4以下的版本无法实现仅使用原生属性的点击事件，所以我们可以换个角度思考问题：

我们想象是否可以隐藏账户页面，于是找到支付登录中的div的id来隐藏支付登录页面，并在控制台中执行。 ('')..='none' 所以它就变成了道路的第二张图片 这样，什么！ 即使改变扫描码页面也无济于事，所以我们必须更换或切换页面。

那么我们来尝试第二个想法，替换页面。 在控制台中执行：.('').=.('')。 将登录页面替换为扫码页面。 这个主意真好，但是什么假的。 二维码消失了！

最终解决方案

其实很简单。 既然无法更换，我们就只能切换，但不知道如何切换。 没关系，我们可以用位移的方法来移动扫描到的代码页，然后就有.('').. = ': ;: ;' 如下所示。 如果现在两个页面重叠了怎么办？ 很简单，隐藏登录页面即可。 。 .('')..='none'ok，这是一个麻烦的解决问题的方法。

ps：这次是跨域解题，正好巩固了前段时间学习h5的基础（我根本没记住什么）。 实践证明，思路为先，好的解决方案才能明确方向。 超过

附加测试代码

@Click(R.id.btn_ali) void onClick(View v) { // wv_alipay.loadUrl("javascript:document.getElementsByClassName('switch-tip-icon-wrapper')[0].style.display='none'"); // wv_alipay.loadUrl("javascript:document.getElementsByClassName('switch-tip-icon-wrapper')[0].click()"); // wv_alipay.loadUrl("javascript:document.getElementById('J_viewSwitcher').click()"); // wv_alipay.loadUrl("javascript:$('.J_viewSwitcher').click()"); // wv_alipay.loadUrl("javascript:document.getElementsByClassName('cashier-center-view view-qrcode fn-left')[0].style.display='block'"); // wv_alipay.loadUrl("javascript:document.getElementById('J_view_pc').style.display='block'"); // wv_alipay.loadUrl("javascript:document.getElementById('J_view_pc').innerHTML=document.getElementById('J_view_qr').innerHTML"); // wv_alipay.loadUrl("javascript:setTimeout('alert(\"hdhdhd\")', 3000)"); // wv_alipay.loadUrl("javascript:alert(\"hdhdhd\")"); wv_alipay.loadUrl("javascript:document.getElementById('J_view_qr').style.cssText = 'position: absolute;right: 100px;';"); }