一、什么是js与android交互?

  通俗一点就是使用js代码调用java代码,或者使用java代码调用js代码。

二、为什么要使用js与java代码交互?

  1.可以做一些js网页做本身处理不了的事情。例如:在网页上调用Android本地打电话,发短信功能、在网页上调用Android手机通讯录、在网页上调用第三方应用、在网页上调用一些Android的本地化处理(操作IO,数据库)等。

  2.可以实现js开发人员与android开发人员合作开发。例如:js开发人员开发js代码供android开发人员调用,android开发人员就不必写js代码,可以专注于andrid开发,用到js的时候直接调用js代码就可以了。(反之亦然)

  3.可以实现网页的动态更新。例如:可以利用js代码调用java的更新数据显示到网页上以达到动态更新网页的目的。

三、js代码调用java代码操作步骤

  1.开启使用js功能

webSettings.setJavaScriptEnabled(true);

  2.设置编码默认编码格式(编码格式要和html编码格式对应)

webSettings.setDefaultTextEncodingName("gbk");

  3.注入提供的java对象到webView:主要是这段代码,解释一下,第一个参数定义了一个对象,该对象中可以写任意的方法,供js代码调用。第二个参数是该自定义对象的一个别名。js调用该对象的方法时会使用到该别名。调用格式为:对象名.方法名。例如:jsobject.androidAlert();调用android的alert对话框。

webView.addJavascriptInterface(new JsObject(), "jsobject");

  4.设置WebChromeClient对象,并实现其中的onJsAlert、onJsConfirm等方法。注意这里必须要实现这几个方法,不然js调用java代码弹框时可能没有反应。

       @Override
public boolean onJsAlert(WebView view, String url, String message,
JsResult result) {
// TODO Auto-generated method stub
return super.onJsAlert(view, url, message, result);
} @Override
public boolean onJsConfirm(WebView view, String url,
String message, JsResult result) {
// TODO Auto-generated method stub
return super.onJsConfirm(view, url, message, result);
} @Override
public boolean onJsPrompt(WebView view, String url, String message,
String defaultValue, JsPromptResult result) {
// TODO Auto-generated method stub
return super.onJsPrompt(view, url, message, defaultValue,
result);
}

四、android代码调用js代码

  这个相对比较简单,只需要一行代码就能搞定:

  例如:

//android调用js代码
webView.loadUrl("javascript:test_alert()");

做完以上几步后就可以实现真正调用了。下面给出完整代码

一、HTML代码jshtml.html(改代码放在assets文件夹下)

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>这是一个HTML</title> <script type="text/javascript">
/*js调用android的方法*/
function jsCallAndroidAlert(){
jsobject.androidAlert();
} function test_alert() {
/* 弹出对话框 */
alert("啊哈!连Android系统都调用JS函数了");
} </script>
</head>
<body>
<button onclick="jsCallAndroidAlert()">test</button>
<button onclick="test_alert()">test_alert</button>
</body>
</html>

二、MainActivity.java

package com.yw.webkitdemo;

import android.os.Bundle;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.content.DialogInterface.OnClickListener;
import android.graphics.Bitmap;
import android.view.Menu;
import android.view.View;
import android.view.ViewGroup.LayoutParams;
import android.webkit.JsPromptResult;
import android.webkit.JsResult;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Button;
import android.widget.ProgressBar;
import android.widget.Toast; @SuppressLint("JavascriptInterface")
public class MainActivity extends Activity implements android.view.View.OnClickListener{
private WebView webView;
private ProgressBar progressBar;
private Button btn_js;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main_layout);
btn_js = (Button)findViewById(R.id.btn_js);
btn_js.setOnClickListener(this);
progressBar = new ProgressBar(this, null,
android.R.attr.progressBarStyleHorizontal);
progressBar.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT,
5)); webView = (WebView) findViewById(R.id.webView);
WebSettings webSettings = webView.getSettings();
// 启用javascrip功能
webSettings.setJavaScriptEnabled(true);
//设置可以使用中文,否则会出现中文乱码
webSettings.setDefaultTextEncodingName("gbk");
webView.addView(progressBar);
webView.setWebChromeClient(new WebChromeClient() {
@Override
public void onProgressChanged(WebView view, int newProgress) {
if (newProgress == 100) {
progressBar.setVisibility(View.GONE);
} else {
if (progressBar.getVisibility() == View.GONE)
progressBar.setVisibility(View.VISIBLE);
progressBar.setProgress(newProgress);
}
super.onProgressChanged(view, newProgress);
} @Override
public boolean onJsAlert(WebView view, String url, String message,
JsResult result) {
// TODO Auto-generated method stub
return super.onJsAlert(view, url, message, result);
} @Override
public boolean onJsConfirm(WebView view, String url,
String message, JsResult result) {
// TODO Auto-generated method stub
return super.onJsConfirm(view, url, message, result);
} @Override
public boolean onJsPrompt(WebView view, String url, String message,
String defaultValue, JsPromptResult result) {
// TODO Auto-generated method stub
return super.onJsPrompt(view, url, message, defaultValue,
result);
}
});
/*
* 此段代码在不做处理的情况下会弹出多个浏览器选择界面 webView.loadUrl("http://www.baidu.com/");
*/
webView.setWebViewClient(new WebViewClient() {
@Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {
super.onPageStarted(view, url, favicon);
} @Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
}
});
// webView.loadUrl("http://www.baidu.com/");
/**
* 自定义对象,以及对象别名
* 自定义对象中定义的方法可以供js调用
* function jsCallAndroidAlert(){
jsobject.androidAlert();
}
*/
webView.addJavascriptInterface(new JsObject(), "jsobject");
//加载我们自定义的html网页并将其显示在webView上
webView.loadUrl("file:///android_asset/jshtml.html");
} /**
* 此类的方法对应html中js的方法,供js调用Android的方法
*
* @author Administrator
*
*/
class JsObject {
public void androidAlert() {
AlertDialog.Builder dialog = new AlertDialog.Builder(MainActivity.this);
dialog.setTitle("温馨提示");
dialog.setMessage("js调用了Android的Alert,测试完毕是否退出?");
dialog.setNegativeButton("否", new OnClickListener() { @Override
public void onClick(DialogInterface arg0, int arg1) { }
});
dialog.setPositiveButton("是", new OnClickListener() { @Override
public void onClick(DialogInterface dialog, int which) {
dialog.dismiss();
}
});
AlertDialog dialog2 = dialog.create();
dialog2.show();
Toast.makeText(MainActivity.this, "您使用js调用了alert方法",
Toast.LENGTH_LONG).show();
} public void androidConfirm() {
Toast.makeText(MainActivity.this, "您使用js调用了confirm方法",
Toast.LENGTH_LONG).show();
}
} /**
* 对系统的back键进行设置
*/
@Override
public void onBackPressed() {
if (webView != null && webView.canGoBack()) {
webView.goBack();
} else {
super.onBackPressed();
} } @Override
public void onClick(View v) {
switch(v.getId()){
case R.id.btn_js:
//android调用js代码
webView.loadUrl("javascript:test_alert()");
break;
}
}
}

三、main_layout.xml文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" > <WebView
android:id="@+id/webView"
android:layout_width="match_parent"
android:layout_height="match_parent" /> <Button
android:id="@+id/btn_js"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="调用javascript函数" /> </LinearLayout>

完成。

WebView之javascript与android交互基础加强的更多相关文章

  1. 在android中实现webview与javascript之间的交互(转)

    参见“在android中实现webview与javascript之间的交互”

  2. Android中webview跟JAVASCRIPT中的交互

    在android的应用程序中,可以直接调用webview中的javascript代码,而webview中的javascript代码,也可以去调用ANDROID应用程序(也就是JAVA部分的代码).下面 ...

  3. webview与JavaScript之间的交互

    据说WebView的强大之处就是能和JavaScript进行交互调用. 参考博客:http://droidyue.com/blog/2014/09/20/interaction-between-jav ...

  4. 一处疑难杂症的术后总结:WebView和JavaScript之间的交互

    近期在公司里參与了M3项目的开发,这个项目是使用HTML5开发的前端页面,在开发完成后,把项目地址写入Android.iOS的壳源代码里面,这样当应用被打开时候自己主动加载项目首页的URL.这样的做法 ...

  5. Android Webview 和Javascript交互,实现Android和JavaScript相互调用

    在Android的开发过程中.遇到一个新需求.那就是让Java代码和Javascript代码进行交互.在IOS中实现起来很麻烦.而在Android中相对来说容易多了.Android对这种交互进行了很好 ...

  6. Android WebView与JavaScript交互操作(Demo)

    应用场景: 为了使Android移动项目能够在较短的时间内完成开发,同时降低技术人员开发的成本投入,往往会采用Hybrid APP的开发模式.相关Hybrid APP(混合型应用)参看:http:// ...

  7. Android混合开发之WebView与Javascript交互

    前言: 最近公司的App为了加快开发效率选择了一部分功能采用H5开发,从目前市面的大部分App来讲,大致分成Native App.Web App.Hybrid App三种方式,个人觉得目前以Hybri ...

  8. Android中WebView的JavaScript代码和本地代码交互的三种方式

    一.Android中WebView的漏洞分析最近在开发过程中遇到一个问题,就是WebView使用的时候,还是需要解决之前系统(4.2之前)导致的一个漏洞,虽然现在这个系统版本用户很少了,但是也不能忽视 ...

  9. Android总结之WebView与Javascript交互[转]

    Android总结之WebView与Javascript交互   前言: 最近公司的App为了加快开发效率选择了一部分功能采用H5开发,从目前市面的大部分App来讲,大致分成Native App.We ...

随机推荐

  1. HDU1824(2-SAT)

    Let's go home Time Limit: 10000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)To ...

  2. Linux 安装redis,redis发布订阅,持久化

    安装redis 1.安装redis的方式 -yum (删除这个yum安装的redis,我们只用源码编译安装的) -rpm -源码编译 2.删除原本的redis yum remove redis -y ...

  3. js将对象数组按照自定义规则排序

    javascript对一个对象数组进行自定义规则排序,对象中有两个字段. 按照对象中一个字段a的值从小到大规则排序, 效果如下: 排序前: [0]:a=9,b=3 [1]:a=33,b=7 [2]:a ...

  4. <Android 应用 之路> 干货集中营 ~ GankIOClient

    简介 利用干货集中营 , daimajia和他的小伙伴给我们开发者带来的福利开发的一个干货集中营客户端,主要功能在阅读干货上. Github地址: https://github.com/onlylov ...

  5. FileWriter剖析

    集合这种容器存储数据,它只能在内存中临时存储,不能永久存储,这样会导致数据的丢失,所以出现了IO流. IO流用来处理设备之间的数据传输.可以用来做复制文件,上传文件,下载文件. 读数据是输入流,写数据 ...

  6. 【Redis】Redis学习(四) Redis Sentinel模式详解

    主从模式的弊端就是不具备高可用性,当master挂掉以后,Redis将不能再对外提供写入操作,因此sentinel应运而生. Redis Sentinel是Redis官方提供的集群管理工具,主要有三大 ...

  7. 前端构建工具Gulp使用总结

    1.安装准备 1.1 Node.js安装 在安装Gulp之前首先的安装Node.js, 安装教程详见Node.js 安装配置 1.2 npm安装 在安装node的时候会自动安装npm模块管理器,详见n ...

  8. 从零自学Java-5.使用条件测试进行判断

    1.使用if语句进行最基本的条件测试:2.测试一个值大于还是小于另一个值:3.测试两个值是否相等:4.使用与if语句对应的else语句:5.组合多个条件测试:6.使用switch语句进行复杂的条件测试 ...

  9. LeetCode题解之Univalued Binary Tree

    1.题目描述 2.问题分析 遍历一遍树,然后将所有节点的数值放入到一个set中,最后检查set中元素的个数是否为1. 3.代码 bool isUnivalTree(TreeNode* root) { ...

  10. Oracle EBS OPM close batch

    --close_batch --created by jenrry DECLARE x_message_count NUMBER; x_message_list VARCHAR2 (4000); x_ ...