Webview Android与js交互
Android 中可以通过webview来实现和js的交互,在程序中调用js代码,只需要将webview控件的支持js的属性设置为true
Android(Java)与JavaScript(HTML)交互有四种情况:
1) Android(Java)调用HTML中js代码
2) Android(Java)调用HTML中js代码(带参数)
3) HTML中js调用Android(Java)代码
4) HTML中js调用Android(Java)代码(带参数)
下面示例总结这四种情况,直接上干货:
1) Android(Java)
- private void showWebView(){ // webView与js交互代码
- try {
- mWebView = new WebView(this);
- setContentView(mWebView);
- mWebView.requestFocus();
- mWebView.setWebChromeClient(new WebChromeClient(){
- @Override
- public void onProgressChanged(WebView view, int progress){
- JSAndroidActivity.this.setTitle("Loading...");
- JSAndroidActivity.this.setProgress(progress);
- if(progress >= 80) {
- JSAndroidActivity.this.setTitle("JsAndroid Test");
- }
- }
- });
- mWebView.setOnKeyListener(new View.OnKeyListener() { // webview can go back
- @Override
- public boolean onKey(View v, int keyCode, KeyEvent event) {
- if(keyCode == KeyEvent.KEYCODE_BACK && mWebView.canGoBack()) {
- mWebView.goBack();
- return true;
- }
- return false;
- }
- });
- WebSettings webSettings = mWebView.getSettings();
- webSettings.setJavaScriptEnabled(true);
- webSettings.setDefaultTextEncodingName("utf-8");
- mWebView.addJavascriptInterface(getHtmlObject(), "jsObj");
- mWebView.loadUrl("http://192.168.1.121:8080/jsandroid/index.html");
- } catch (Exception e) {
- e.printStackTrace();
- }
- }
- private Object getHtmlObject(){
- Object insertObj = new Object(){
- public String HtmlcallJava(){
- return "Html call Java";
- }
- public String HtmlcallJava2(final String param){
- return "Html call Java : " + param;
- }
- public void JavacallHtml(){
- runOnUiThread(new Runnable() {
- @Override
- public void run() {
- mWebView.loadUrl("javascript: showFromHtml()");
- Toast.makeText(JSAndroidActivity.this, "clickBtn", Toast.LENGTH_SHORT).show();
- }
- });
- }
- public void JavacallHtml2(){
- runOnUiThread(new Runnable() {
- @Override
- public void run() {
- mWebView.loadUrl("javascript: showFromHtml2('IT-homer blog')");
- Toast.makeText(JSAndroidActivity.this, "clickBtn2", Toast.LENGTH_SHORT).show();
- }
- });
- }
- };
- return insertObj;
- }
2) js(HTML)
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <!-- saved from url=(0032)http://localhost:8080/jsandroid/ -->
- <html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
- <meta http-equiv="Expires" content="0">
- <meta http-equiv="Pragma" content="no-cache">
- <meta http-equiv="Cache-Control" content="no-store,no-cache">
- <meta name="Handheldfriendly" content="true">
- <meta name="viewport" content="width=100%; initial-scale=1.0; user-scalable=yes">
- <meta name="robots" content="all">
- <meta name="keywords" contect="doodle, mobile, doodlemobile, game, games">
- <meta name="description" content="Make People's Mobile Life More Connected Through Games.">
- <title>jsandroid_test</title>
- <script type="text/javascript" language="javascript">
- function showHtmlcallJava(){
- var str = window.jsObj.HtmlcallJava();
- alert(str);
- }
- function showHtmlcallJava2(){
- var str = window.jsObj.HtmlcallJava2("IT-homer blog");
- alert(str);
- }
- function showFromHtml(){
- document.getElementById("id_input").value = "Java call Html";
- }
- function showFromHtml2( param ){
- document.getElementById("id_input2").value = "Java call Html : " + param;
- }
- </script>
- </head>
- <body>
- hello IT-homer
- <br>
- <br>
- <br>
- <input type="button" value="HtmlcallJava" onclick="showHtmlcallJava()" />
- <br>
- <input type="button" value="HtmlcallJava2" onclick="showHtmlcallJava2()" />
- <br>
- <br>
- <br>
- <br>
- <input id="id_input" style="width: 90%" type="text" value="null" />
- <br>
- <input type="button" value="JavacallHtml" onclick="window.jsObj.JavacallHtml()" />
- <br>
- <br>
- <br>
- <input id="id_input2" style="width: 90%" type="text" value="null" />
- <br>
- <input type="button" value="JavacallHtml2" onclick="window.jsObj.JavacallHtml2()" />
- </body>
- </html>
3) 运行结果:
4) 代码解析:
(1) 允许Android执行js脚本设置
Android(Java)与js(HTML)交互的接口函数是: mWebView.addJavascriptInterface(getHtmlObject(), "jsObj"); // jsObj 为桥连对象
Android容许执行js脚本需要设置: webSettings.setJavaScriptEnabled(true);
(2) js(HTML)访问Android(Java)代码
js(HTML)访问Android(Java)端代码是通过jsObj对象实现的,调用jsObj对象中的函数,如: window.jsObj.HtmlcallJava()
(3) Android(Java)访问js(HTML)代码
Android(Java)访问js(HTML)端代码是通过loadUrl函数实现的,访问格式如:mWebView.loadUrl("javascript: showFromHtml()");
说明:
1) Android访问url网址,需在AndroidManifest.xml文件,配置容许访问网络的权限:
<uses-permission android:name="android.permission.INTERNET" />
2) Android(Java)调用js(HTML)时,使用的mWebView.loadUrl("javascript: showFromHtml()");函数需在UI线程运行,因为mWebView为UI控件
Webview Android与js交互的更多相关文章
- Android与js交互拍照上传资料
应用场景:h5通知android端拍照,选相册,然后将图片路径上传成功之后,获取到网络路径,将此路径返还给h5界面,并展示出来. android与js快速交互 效果图如下: 1.在Activity ...
- Android—android与js交互以及相互传参
Android中可以通过WebView来实现与js的交互,让用户可以在android客户端看到js写的页面,接下来为大家介绍的就是怎样实现此功能: 首先android项目目录下有“assets”文件夹 ...
- Android与js交互实例
Android 中可以通过webview来实现和js的交互,在程序中调用js代码,只需要将webview控件的支持js的属性设置为true Android(Java)与JavaScript(HTML) ...
- Android与js交互
本文转载自:http://blog.csdn.net/it1039871366/article/details/46372207 一文. Android 中可以通过webview来实现和js的交互,在 ...
- Mac Webview OC与JS交互实现
1.首先,需要定义一个JS可识别的变量(如external)用于OC与JS交互 - (void)webView:(WebView *)sender didClearWindowObject:(WebS ...
- android 和 js 交互
1.html代码 <script type="text/javascript"> function javacalljs(){ document.getElementB ...
- Android与JS交互,json传参问题
一.JS调用Android的方法 JS调用安卓的方法,并且传递的参数为json格式的字符串(JSONObject.toString()), 例如: var json = {"name&quo ...
- Android 和 JS交互方法初探
起初有个需求,就是需要监听网页的图片点击,然后图片单独跳转到另一个页面单独显示 这里就需要用JS和Android Native方法之间的通信 先说上面的解决办法之前先引出两个Android的方法 1: ...
- WebView Android 调用js且须要获取返回结果
Android webView调用js方法非常easy, webView.loadUrl("javascrpt:yourFunction()"); 可是此方法没有办法获取返回结果 ...
随机推荐
- 关于Java(标识符规则)
Java 是大小写敏感的语言. Java 标识符组成 Java 标识符组成: 字母,数字,下划线和美元符 $ Java 标识符规则 仅包含 字母,数字,下划线和美元符 开头不能使数字 不能使 Java ...
- LPSTR、LPCSTR、LPTSTR、LPCTSTR、LPWSTR及LPCWSTR的意义及区别
引用 LPSTR.LPCSTR.LPTSTR.LPCTSTR.LPWSTR及LPCWSTR的意义及区别 1.ANSI(即MBCS):为多字节字符集,它是不定长表示世界文字的编码方式.ANSI表示英文字 ...
- SQL Server 全文搜索 配置、查询初体验
原文:SQL Server 全文搜索 配置.查询初体验 一.使用SQL Server全文搜索配置 要使用SQL Server的全文搜索服务,需要进行如下配置. 1.开启全文搜索服务: 2.开启数据库的 ...
- Maven实战六
转载:http://www.iteye.com/topic/1132509 一.简介 settings.xml对于maven来说相当于全局性的配置,用于所有的项目,当Maven运行过程中的各种配置,例 ...
- Leetcode:Repeated DNA Sequences详细题解
题目 All DNA is composed of a series of nucleotides abbreviated as A, C, G, and T, for example: " ...
- A Simple problem
http://acm.sdut.edu.cn/sdutoj/problem.php?action=showproblem&problemid=2497 题意:给出顶点数,边数及节点s,判断s是 ...
- CF-164C. Machine Programming(最小费用最大流)
题意: 给你n个任务,k个机器,n个任务的起始时间,持续时间,完成任务的获利 每个机器可以完成任何一项任务,但是同一时刻只能完成一项任务,一旦某台机器在完成某项任务时,直到任务结束,这台机器都不能去做 ...
- POJ 2289 Jamie's Contact Groups(多重匹配+二分)
题意: Jamie有很多联系人,但是很不方便管理,他想把这些联系人分成组,已知这些联系人可以被分到哪个组中去,而且要求每个组的联系人上限最小,即有一整数k,使每个组的联系人数都不大于k,问这个k最小是 ...
- 【转】图说Android的8年演变史
原文网址:http://tech.gmw.cn/2016-02/17/content_18916338_14.htm 图说Android的8年演变史 我有话说 0 2011年10月谷歌 ...
- C++递归求解N个元素的所有子集
C++递归求解N个元素的所有子集 引言: 我在复习C++遇到了设计递归函数的问题.这个例子,很好的显示了设计递归的方式,思想. 这与斐波那数列不同,这个例子更有应用意义. 问题: 试编写一个递归函数, ...