Android中java和javascript方法的互相调用示例

原创 2016年12月24日 05:48:05

说不清,直接贴代码:

首先是网页:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>js和android相互调用</title>
<head>

<script type="text/javascript" language="javascript">
	//调用java方法jsCallJava()
	function showHtmlcallJava() {
		var str = window.android.jsCallJava();
		document.getElementById("info1").value = str;
	}

	//调用java方法jsCallJavaWithParams(String var),带参数
	function showHtmlcallJava2() {
		var str = window.android.jsCallJavaWithParams("Devin Chen");
		document.getElementById("info2").value = str;
	}

	//提供给java调用的方法
	function show() {
		document.getElementById("id_input").value = "Java调用Html中的方法";
	}

	//提供给java调用的方法,带参数
	function showWithParam(param) {
		document.getElementById("id_input2").value = "Java调用Html中的方法: " + param;
	}
</script>
</head>

<body>
	<input id="info1" style="width: 90%" type="text" value="null" /><br>
	<input type="button" value="Html调用Java方法" onclick="showHtmlcallJava()" /><br>
	<input id="info2" style="width: 90%" type="text" value="null" /><br>
	<input type="button" value="Html调用带参数的Java方法" onclick="showHtmlcallJava2()" /><br>
	<input id="id_input" style="width: 90%" type="text" value="null" /><br>
	<input type="button" value="Java调用Html方法" onclick="window.android.javaCallJavaScript()" /><br>
	<input id="id_input2" style="width: 90%" type="text" value="null" /><br>
	<input type="button" value="Java调用带参数的Html方法" onclick="window.android.javaCallJavaScriptWithParams()" />
</body>
</html>


Android部分的布局就一个WebView,MainActivity源代码:

/**
 * java方法和javascript方法的相互调用
 */
public class MainActivity extends AppCompatActivity {
    private static final String url = "http://192.168.0.100:8080/server";
    private WebView mWebView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
    }

    private void initView() {
        mWebView = (WebView) findViewById(R.id.web_main);
        WebSettings settings = mWebView.getSettings();
        settings.setJavaScriptEnabled(true);
        settings.setDefaultTextEncodingName("utf-8");
        mWebView.loadUrl(url);
        mWebView.setWebViewClient(new WebViewClient());
        //这两句是必须的,"android"就是jsp中调用方法时window后面的对象
        Object obj = getObject();
        mWebView.addJavascriptInterface(obj, "android");
    }

    private Object getObject() {

        Object obj = new Object() {
            /**
             * html中的JavaScript调用Java方法
             * 注解是必须的
             * @return
             */
            @JavascriptInterface
            public String jsCallJava() {
                return "JavaScript调用Java方法";
            }

            /**
             * html中的JavaScript调用带参数的Java方法
             * 注解是必须的
             * @return
             */
            @JavascriptInterface
            public String jsCallJavaWithParams(String var) {
                return "JavaScript调用带参数的Java方法" + var;
            }

            /**
             * java调用html中的方法,遗憾的是不知道有什么办法可以拿到返回值
             */
            @JavascriptInterface
            public void javaCallJavaScript() {
                runOnUiThread(new Runnable() {
                    @Override
                    public void run() {
                        mWebView.loadUrl("javascript:show()");

                    }
                });
            }

            /**
             * java调用html中的方法,并且传递参数,这个有大用
             */
            @JavascriptInterface
            public void javaCallJavaScriptWithParams() {
                runOnUiThread(new Runnable() {
                    @Override
                    public void run() {
                        mWebView.loadUrl("javascript:showWithParam('baoge')");
                    }
                });
            }

        };
        return obj;
    }
}

运行结果:


可见运行时没有问题的。原来的html网页中有alert弹出,不知道为什么没有起作用,改成文本框显示没问题,可见两者之间的机制没有问题。alert的问题好解决,这里不纠结。

前几天有朋友告诉我音乐播放器可以使用html5的网页播放器,很漂亮,把播放地址当参数传进去就可以了。现在弄清楚,就可以去尝试了。

版权声明:本文为博主原创文章,未经博主允许不得转载。

Android:java和javascript相互调用

一:WebView的简单了解 1.最基本也是最重要的是在AndroidManifest.xml 中必须添加访问网络权限  android:name="android.permission.INTE...
  • moshuome
  • moshuome
  • 2016年06月16日 09:13
  • 1673

Android——js与Java互调

啰嗦: 再怎么说我也是做个一段时间的前端开发工作的,做了一个类似京东的手机商城,入口是微信公众号,做完这个项目我还做了一个伪伪伪APP使用一个webView将首页的URL加载进去,就是一个商城的AP...
  • iliupp
  • iliupp
  • 2017年05月18日 14:35
  • 486

Android WebView详解之JS调用Java方法

1、布局文件:只有一个WebView控件
  • c19344881x
  • c19344881x
  • 2015年01月07日 11:19
  • 6873

JS 与JAVA 的互相调用

混合开发因为其高度的可扩展性和维护性,很多公司都采用了这种开发方式,对于安卓客户端来说,除了核心的WebView,涉及到最多的就是JAVA与JS的交互。本文旨在简单的介绍一下JS与JAVA的交互。 ...
  • lotty_wh
  • lotty_wh
  • 2017年04月27日 18:07
  • 353

自己整理的js调用安卓Java的方法

今天在Android的开发过程中、遇到一个新需求、那就是让Java代码和Javascript代码进行交互、在IOS中实现起来很麻烦、而在Android中相对来说容易多了、Android对这种交互进行了...
  • LanSeTianKong12
  • LanSeTianKong12
  • 2015年07月31日 15:59
  • 1155

Android:java和javascript相互调用

Android:java和javascript相互调用....
  • fyj568213959
  • fyj568213959
  • 2016年10月10日 14:26
  • 559

如何在js调用java方法并取回返回值

我在写项目的时候需要js和java在WebView进行交互,并且需要js调用java方法并返回参数给js,找了几个文档感觉写的不怎么详细,我就想了个办法试了试成功之后我就将细节写成文档记录一下,方便日...
  • u014548562
  • u014548562
  • 2017年09月09日 17:08
  • 1309

html通过JavaScript调用java代码

使用DWR实现JS调用服务端Java代码 1 DWR简介 DWR全称Direct Web Remoting,是一款非常优秀的远程过程调用(Remote Procedure Call)框架,通过浏览器提...
  • n1007530194
  • n1007530194
  • 2015年12月01日 19:55
  • 11510

Js调用Java方法并互相传参

Js通过PhoneGap调用Java方法并互相传参的。 一、JAVA代码 写一个类,该类继承自Plugin并重写execute方法。 import org.json.JSONAr...
  • luoww1
  • luoww1
  • 2016年12月30日 17:37
  • 970

Js代码和Java代码之间的互相调用了

很多复杂的UI界面,在Android中需要配合大量xml代码和Java代码实现,而使用HTML5可以非常轻松的实现出来,而且具有很好的跨平台特性,让我们不必为了多个平台而重写代码,H5学习成本也较低,...
  • gong1422425666
  • gong1422425666
  • 2017年01月26日 12:20
  • 1899
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Android中java和javascript方法的互相调用示例
举报原因:
原因补充:

(最多只允许输入30个字)