本文介绍: 前言一个应用既有安卓端又有ios端,为了同步时间进度,打算用H5网页替代原生的方法,那么在H5中,网页的返回按钮怎么调用安卓的方法,finish掉Activity呢?方法1安卓:// webview的配置webview.getSettings().setJavaScriptEnabled(true);webview.getSettings().setDefaultTextEncodingName(“UTF-8”);webview.addJavascriptInterface(new
前言
一个应用既有安卓端又有ios端,为了同步时间进度,打算用H5网页替代原生的方法,那么在H5中,网页的返回按钮怎么调用安卓的方法,finish掉Activity呢?
方法1
安卓:
// webview的配置
webview.getSettings().setJavaScriptEnabled(true);
webview.getSettings().setDefaultTextEncodingName("UTF-8");
webview.addJavascriptInterface(new JS(), "android");// 自己指定接口对象的名字,我的叫android
webview.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
webview.loadUrl(load_url);
// 内部类,对应于js中想要安卓执行什么操作,我觉得最主要的还是返回按钮的功能,关闭当前acticity
class JS {
@JavascriptInterface
public void onBack(){
finish();
}
}
H5的js:
// js的button的点击事件调用的方法
onBack() {
// android是我之前安卓代码里指定的名字,调用返回方法
android.onBack()
// window.history.back(-1);//返回上一层
},
ps: 主要用于网页全屏的情况下,但还是推荐用原生的标题栏,因为ios和安卓顶部高度都不一致,不同手机型号,刘海屏等原因也会不一致。这里不想用原生标题栏的原因就是右边有个筛选按钮,它要弄弹窗,js的弹窗比安卓的弹窗简单多了,但是为了适配的问题,我还是选择用了原生了,嘤嘤嘤。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/ll_webview"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- 全屏网页的标题栏 -->
<LinearLayout
android:background="@color/f2f2f2"
android:layout_width="match_parent"
android:layout_height="25dp">
</LinearLayout>
<!-- 原生的标题栏 -->
<include android:visibility="gone" layout="@layout/include_title_left_image"/>
<WebView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/white"
android:id="@+id/webview_wv"
/>
</LinearLayout>
方法2
H5:
// 点击事件
<a @click="callPhone(deliverymanPO.telephone)" class="button-style">联系ta</a>
// deviceType是三端传给你的参数,告知你是什么端,然后调用不同的方法,对接就是他们三端的事了
callPhone(id) {
// H5要调用三端的事:打电话
var toAppType = 'call_telephone';
try {
if (this.deviceType === 'miniprogram') {
wx.miniProgram.postMessage({ data: JSON.stringify(toAppType) });
} else if (this.deviceType === 'ios') {
window.webkit.messageHandlers.iOSAppModel.postMessage({ type: toAppType, code: '', id: id+"" || '' });
} else if (this.deviceType === 'android') {
prompt('js://' + toAppType + '?code=' + ('') + '&id=' + (id+"" || ''));
}
} catch (error) {
console.log(error);
}
},
参考资料
最全面总结 Android WebView与 JS 的交互方式 – 简书
原文地址:https://blog.csdn.net/weixin_43991241/article/details/121769493
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若转载,请注明出处:http://www.7code.cn/show_8497.html
如若内容造成侵权/违法违规/事实不符,请联系代码007邮箱:suwngjj01@126.com进行投诉反馈,一经查实,立即删除!
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。