Android当中跟js进行交互,实现方法的互调

简介:

今天在浏览的时候看到Android跟js的交互,就想的学习一下,上网搜了很多资料,感觉还不是太难,就自己动手试了下,结果出了很多问题

说起交互其实很简单,只是可能sdk的版本或是别的一些小问题会困扰很长时间:

这是代码:

package wst.webview;

import android.annotation.SuppressLint;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.webkit.JavascriptInterface;
import android.webkit.WebView;
import android.widget.Button;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends Activity {

    private WebView contentWebView = null;
    private TextView msgView = null;

    @SuppressLint("SetJavaScriptEnabled")
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        contentWebView = (WebView) findViewById(R.id.webview);
        msgView = (TextView) findViewById(R.id.msg);
        // 启用javascript
        contentWebView.getSettings().setJavaScriptEnabled(true);
        // 从assets目录下面的加载html
        contentWebView.loadUrl("file:///android_asset/wst.html");

        Button button = (Button) findViewById(R.id.button);
        button.setOnClickListener(btnClickListener);
    
        contentWebView.addJavascriptInterface(this, "android");
    }

    OnClickListener btnClickListener = new Button.OnClickListener() {
        public void onClick(View v) {
            // 无参数调用
            contentWebView.loadUrl("javascript:javacalljs()");
            // 传递参数调用
            contentWebView.loadUrl("javascript:javacalljswithargs(" + "'nimabi'" + ")");
        }
    };

    public void startFunction() {
        Toast.makeText(this, "js调用了java函数", Toast.LENGTH_SHORT).show();
        runOnUiThread(new Runnable() {

            @Override
            public void run() {
                msgView.setText(msgView.getText() + "\njs调用了java函数");

            }
        });
    }

    public void startFunction(final String str) {
        Toast.makeText(this, str, Toast.LENGTH_SHORT).show();
        runOnUiThread(new Runnable() {

            @Override
            public void run() {
                msgView.setText(msgView.getText() + "\njs调用了java函数传递参数:" + str);

            }
        });
    }
    
}



还有html的代码:这是在assets文件夹下

<html>
<head>
<meta http-equiv="Content-Type"    content="text/html;charset=gb2312">
<script type="text/javascript">
function javacalljs(){
     document.getElementById("content").innerHTML +=   
         "<br\>java调用了js函数";
}

function javacalljswithargs(arg){
     document.getElementById("content").innerHTML +=   
         ("<br\>"+arg);
}
function showAndroidToast(toast) {
        wst.showToast(toast);
}
</script>
</head>
<body>
this is my html <br/>
<a onClick="window.android.startFunction()">点击调用java代码</a><br/>
<a onClick="window.android.startFunction('helloworld')" >点击调用java代码并传递参数</a>
<br/>
<div id="content">内容显示</div>
</body>
</html>

 

我今天主要遇到的问题是java调用js可以实现,但是js调用java代码没有反应,在网上查到说是注入的问题,但是注入了也不能用,想的既然版本限制的问题,然后我删掉清单文件中的

  <uses-sdk
        android:minSdkVersion="7"
        android:targetSdkVersion="16" />
程序就ok了,搞通这个以后就可以实现Android跟js间数据传递。


相关文章
|
6天前
|
存储 JavaScript 索引
JS中数组的相关方法介绍
JS中数组的相关方法介绍
|
8天前
|
JavaScript 前端开发 容器
AJAX载入外部JS文件到页面并让其执行的方法(附源码)
AJAX载入外部JS文件到页面并让其执行的方法(附源码)
13 0
|
9天前
|
JSON JavaScript 前端开发
JavaScript原生代码处理JSON的一些高频次方法合集
JavaScript原生代码处理JSON的一些高频次方法合集
|
1月前
|
JavaScript 前端开发
解释 JavaScript 中的`map()`、`filter()`和`reduce()`方法的用途。
解释 JavaScript 中的`map()`、`filter()`和`reduce()`方法的用途。
17 1
|
1月前
|
JavaScript
JS绑定事件的三种方法(简单易懂)
JS绑定事件的三种方法(简单易懂)
|
1月前
|
JavaScript
JS中改变this指向的六种方法
JS中改变this指向的六种方法
|
6天前
|
JavaScript 前端开发 索引
JavaScript中与字符串相关的方法
JavaScript中与字符串相关的方法
|
1月前
|
JavaScript
JS数组增删方法的原理,使用原型定义
JS数组增删方法的原理,使用原型定义
|
1天前
|
JavaScript
JS生成uuid的四种方法
JS生成uuid的四种方法
4 0
|
1天前
|
JavaScript 前端开发 iOS开发
js实用方法记录-动态加载css/js
js实用方法记录-动态加载css/js
9 0