Javascript和android原生互调
最近在做原生和js端的互调的功能,自己改了个demo,给大家讲解下。
先上js代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>方法调用基本流程测试</title>
</head>
<body>
<div id="helloweb">
<div id="echoInfo">如果有数据返回,会显示在这儿</div>
</div>
<script type="text/javascript">
function funFromjs(){
document.getElementById("helloweb").innerHTML="HelloWebView,i'm from js";
}
function echoInfo( container, obj ){
var domContainer = document.getElementById('echoInfo');
domContainer.innerHTML = JSON.stringify( obj );
}
//function windowCallback( str ){
//echoInfo( 'echoInfo', str );
//}
window.windowCallback = function( str ){
echoInfo( 'echoInfo', str );
};
var MfsJSBridge = MfsJSBridge || undefined;
if( undefined != MfsJSBridge ){
//看这里
var params = {
id : 1,
name : '测试'
};
var strParams = JSON.stringify( params );
MfsJSBridge.invoke( 'testFunc', strParams, 'windowCallback');
}else{
alert('未定义MfsJSBridge');
}
</script>
</body>
</html>
android webview 设置可用javascript
//设置编码
mWebView.getSettings().setDefaultTextEncodingName("utf-8");
//支持js
mWebView.getSettings().setJavaScriptEnabled(true);
android 调js
mBtn1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
mWebView.loadUrl("javascript:funFromjs()");//其中funFromjs()为js的方法
Toast.makeText(mContext, "调用javascript:funFromjs()", Toast.LENGTH_LONG).show();
}
});
js调原生,原生响应时间并回调数据
mWebView.addJavascriptInterface(new Object(){
//注意4.4以后加注解,位置在这个方法名上面,鉴于很多这个的例子,瞎、、写注解位置,并需要下 //载积分写了这个
@JavascriptInterface
public void invoke(String name ,String t,String callback) {
if(name.equals("testFunc")){
//其中t 为js带过来的数据
Toast.makeText(mContext, t,Toast.LENGTH_LONG).show();
String strJson = "{\"code\":122, \"msg\":\"1231\", \"data\":null}";
//回调数据给js 其中callback 为android 掉js 的方法名称。
mWebView.loadUrl("javascript:"+ callback +"('" + strJson + "')");
}
// Toast.makeText(mContext, name, Toast.LENGTH_LONG).show();
}
},"MfsJSBridge");
代码比较简单,最主要的是 @JavascriptInterface注解的位置大家注意下。
Javascript和android原生互调的更多相关文章
- JavaScript调用App原生代码(iOS、Android)通用解决方案
实际场景 场景:现在有一个H5活动页面,上面有一个登陆按钮,要求点击登陆按钮以后,唤出App内部的登录界面,当登录成功以后将用户的手机号返回给H5页面,显示出来.这个场景应该算是比较完整的一次H5中的 ...
- PhoneGap或者Cordova框架下实现Html5中JS调用Android原生代码
PhoneGap或者Cordova框架下实现Html5中JS调用Android原生代码 看看新闻网>看引擎>开源产品 0人收藏此文章, 发表于8小时前(2013-09-06 00:39) ...
- Android-----js和android的互调
Android-----js和android的互调 http://code.google.com/p/apps-for-android/source/browse/trunk/Samples/We ...
- React Native Android原生模块开发实战|教程|心得|怎样创建React Native Android原生模块
尊重版权,未经授权不得转载 本文出自:贾鹏辉的技术博客(http://blog.csdn.net/fengyuzhengfan/article/details/54691503) 告诉大家一个好消息. ...
- Android原生和H5交互;Android和H5混合开发;WebView点击H5界面跳转到Android原生界面。
当时业务的需求是这样的,H5有一个活动商品列表的界面,IOS和Android共用这一个界面,点击商品可以跳转到Android原生的商品详情界面并传递商品ID: 大概就是点击H5界面跳转到Androi ...
- 将React Native集成至Android原生应用
将React Native集成至Android原生应用 Android Studio 2.1 Preview 4生成的空项目 react-native 环境 0.22.2 初次编译后apk有1.1M, ...
- uni-app&H5&Android混合开发三 || uni-app调用Android原生方法的三种方式
前言: 关于H5的调用Android原生方法的方式有很多,在该片文章中我主要简单介绍三种与Android原生方法交互的方式. 一.H5+方法调用android原生方法 H5+ Android开发规范官 ...
- 拓展 Android 原生 CountDownTimer 倒计时
拓展 Android 原生 CountDownTimer 倒计时 [TOC] CountDownTimer 在系统的CountDownTimer上进行的修改,主要是拓展了功能,当然也保留了系统默认的模 ...
- Android原生json和fastjson的简单使用
android原生操作json数据 主要是两个类 JSONObject 操作对象 JONSArray操作json数组 对象转json //创建学生对象 Student student=new ...
随机推荐
- sqlserver 限制用户只能访问指定的视图
项目中有一个需求,要求给其它单位提供数据,我们用到了视图,并要求不能让他们看到数据库中的其它数据,我们为其创建了单独的账号,并只能看到指定视图 一.创建视图 CREATE VIEW [dbo].[v_ ...
- 【linux相识相知】VIM编辑器
Vim是一个类似Vi的著名的功能强大.高度可定制的文本编辑器,在Vi的基础上改进和增加了许多的功能,VIM是自由软件,今天我们就来讲讲VIM的使用方法. 本文是基于centos7上的vim编辑器演示的 ...
- 使用c#正则验证关键字并找出匹配项
在.net里,使用类Regex可以正则验证一些关键字并取出匹配项. 1.使用Regex.IsMatch(string input, string pattern, RegexOptions ...
- 前端自动分环境打包(vue和ant design)
现实中的问题:有时候版本上线的时候,打包时忘记切换环境,将测试包推上正式服务器,那你就会被批了. 期望:在写打包的命令行的时候就觉得自己在打包正式版本,避免推包时候的,不确信自己的包是否正确. 既然有 ...
- Maven学习篇一:依赖了解
1.依赖配置 <project> ... <dependencies> <dependency> <groupId>xx</groupId> ...
- ezdpl Linux自动化部署实战
最近把ezdpl在生产环境中实施了,再加上这段时间的一些修改,一并介绍一下. 再次申明: ezdpl不是开箱即用的,需要根据自己的应用环境定制.对初学者来说使用起来反倒困难更多.风险更大. 它不是一个 ...
- SharePoint 2013 - Client OM
1. 向 executeQueryAsync 中传递参数可以使用以下两种方式,也可以参考这篇文章: var mySuccessCallBack = Function.createCallback(on ...
- LeetCode刷题系列——Add Two Numbers
题目链接 这个题目很简单,归并而已,好久没练编程,居然忘了在使用自定义类型前,要进行初始化(new操作). class ListNode{ int val; ListNode next; ListNo ...
- java面试题之----mysql表优化方案
本文转载自segmentfault,原文链接:https://segmentfault.com/a/1190000006158186. 当MySQL单表记录数过大时,增删改查性能都会急剧下降,可以参考 ...
- SQL Server ->> 查看SQL Server备份历史
找到最近数据库备份的细节信息,包括备份设备名和地址,最后备份时间 ------------------------------------------------------------------- ...