您的位置：首页 > 移动开发 > Android开发

Android中webview js与native方法互相调用

2016-06-12 14:51 656 查看

android webview允许js与native方法互相调用，基本的调用方法不再赘述，有个比较特殊的场景，记录一下：

已经有一个完整的h5页面，现在要将该页面集成到app中，但是有部分h5页面中的逻辑需要使用本地方法实现；

如果不想修改h5，可以通过如下方法：

1 首先，在客户端写一段js代码，该js与h5中的js名称参数一致，目的是使用本地的js代码覆盖掉h5页面中原有的代码；

2 客户端注入供js调用的native方法；

3 在1中的js代码中，调用2中的native方法。

客户端代码：

1 本地js代码：

String js = "function reply_click(clicked_id) {window.control.toastMessage(clicked_id)}";

2 本地navite方法

public class JsInteration {

@JavascriptInterface

public void toastMessage(String message) {

Toast.makeText(getActivity(), message, Toast.LENGTH_LONG).show();

}

}

3 注入本地方法，供1调用；

mWebView.addJavascriptInterface(new JsInteration(), "control");

h5代码：

<!DOCTYPE html>

<html>

<head></head>

<body>
<h1>lalala</h1>

<button id="1" onClick="reply_click(this.id)">B1</button>

<button id="2" onClick="reply_click(this.id)">B2</button>

<button id="3" onClick="reply_click(this.id)">B3</button>

</body>

<script type="text/javascript">

function reply_click(clicked_id)

{

alert(clicked_id);

}

</script>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： android webview js native

相关文章推荐

新的分享

章节导航