zoukankan      html  css  js  c++  java
  • JavaScript与Java通信

    1、WebView中JavaScript调用Android程序中Java:

    使用WebView类中的addJavascriptInterface()方法,能够使用它扩展嵌入式浏览器内的DOM(文档对象模型),并定义JavaScript代码能够訪问的新对象。JavaScript代码调用该对象的方法时。实际上它会调用Android程序中的方法。


    2、在Android程序中调用JavaScript方法:

    调用loadUrl()方法。将URL以javascript:要运行的代码 的形式传递给它。浏览器会在当前页面运行给定的JavaScript表达式。而不是转到新的页面。


    实例:


    构建一个Android程序,布局例如以下(res/layout/activity_local_browser.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="fill_parent"
        android:orientation="vertical" >
        <WebView
            android:id="@+id/web_view"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1.0" />
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1.0"
            android:orientation="vertical" >
            <TextView
                android:id="@+id/url_field"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:text="@string/textview"/>
            <Button
                android:id="@+id/button"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/call_javascript_from_android" />
            <TextView 
                android:id="@+id/text_view"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"/>  
        </LinearLayout>
    </LinearLayout>
    能够看出,布局的上半部分是WeView控件。下部分是来自Android用户界面的TextView和Button。

    以下须要完毕将被载入到WebView中的index.html文件(assets/index.html),代码例如以下

    <html>
    <head>
    <script language="JavaScript">
    	function callJS(arg){
    			document.getElementById('replaceme').innerHTML = arg;
    		}
    </script>
    </head>
    <body>
    <h1>WebView</h1>
    <p>
    <a href="#" onclick="window.alert('Alert from JavaScript')">
    	Display JavaScript alert</a>
    </p>
    <p>
    <a href="#" onclick="window.android.callAndroid('Hello from Browser')">
    	Call Android from JavaScript</a>
    </p>
    <p id="replaceme">
    </p>
    </body>
    </html>
    

    能够看到。callJS()函数是将会在Java代码中被调用JavaScript函数,它接收一个參数并赋值给replaceme标签。往下的两条链接各自是调用window.alert()函数(显示短消息)和window.android对象的callAndroid()方法(在Java代码中定义好的)。

    同一时候不要忘记在res/values/strings.xml文件里完毕字符串的赋值:

    <?xml version="1.0" encoding="utf-8"?>
    <resources>
        <string name="app_name">LocalBrower</string>
        <string name="action_settings">Settings</string>
        <string name="textview">TextView</string>
        <string name="call_javascript_from_android">Call JavaScript from Android</string>
    </resources>
    


    完毕这些准备后,就能够把目光放在程序的LocalBrowser类上了,代码例如以下:

    package com.example.localbrowser;
    import android.support.v7.app.ActionBarActivity;
    import android.annotation.SuppressLint;
    import android.os.Bundle;
    import android.os.Handler;
    import android.view.Menu;
    import android.view.MenuItem;
    import android.view.View;
    import android.view.View.OnClickListener;
    import android.webkit.JavascriptInterface;
    import android.webkit.JsResult;
    import android.webkit.WebView;
    import android.webkit.WebChromeClient;
    import android.widget.Button;
    import android.widget.TextView;
    import android.widget.Toast;
    
    @SuppressLint("JavascriptInterface")
    public class LocalBrowser extends ActionBarActivity {
    	private WebView webview;
    	private Button button;
    	private TextView textview;
    	private final Handler handler = new Handler();
    	
    	@Override
    	protected void onCreate(Bundle savedInstanceState) {
    		super.onCreate(savedInstanceState);
    		setContentView(R.layout.activity_local_browser);
    
    		webview = (WebView) findViewById(R.id.web_view);
    		button = (Button) findViewById(R.id.button);
    		textview = (TextView) findViewById(R.id.text_view);
    		
    		button.setOnClickListener(new OnClickListener() {
    			public void onClick(View view) {
    				//单击按钮时,通过WebView.loadUrl()方法调用index.html中定义的callJS()函数
    				webview.loadUrl("javascript:callJS('Hello from Android')");
    			}
    		});
    		//打开JavaScript(默认是关闭的)
    		webview.getSettings().setJavaScriptEnabled(true);
    		//往WebView中注入Java对象,从而使得在index.tml中能使用此对象的方法
    		webview.addJavascriptInterface(new AndroidBridge(), "android");
    		
    		webview.setWebChromeClient(new WebChromeClient() {
    			// 覆盖默认的window.alert()的展示界面
    			public boolean onJsAlert(final WebView view, final String url,
    					final String message, JsResult result) {
    				Toast.makeText(LocalBrowser.this, message, 3000).show();
    				result.confirm();
    				return true;
    			}
    		});
    		webview.loadUrl("file:///android_asset/index.html");//载入本地网页,注意有3个斜杠
    	}
    	public class AndroidBridge {
    		@JavascriptInterface
    		// 要通过JavaScript调用的Java代码片段
    		public void callAndroid(final String arg) {
    			handler.post(new Runnable() {
    				public void run() {
    					textview.setText(arg);
    				}
    			});
    		}
    	}
    }

    整个过程非常easy,但有点要注意的是:

    在AdroidBridge类中

    4.2之前向WebView注入的对象所暴露的接口callAndroid没有凝视语句@JavascriptInterface,而4.2及以后的则多了凝视语句@JavascriptInterface。假设去掉这行代码,当程序调用此方法时。将不能成功,而logcat会报例如以下输出:

    E/Web Console: Uncaught TypeError: Object [object Object] has no method 'callAndroid'


    程序界面:



    当单击button和链接时,它会在两个环境间进行调用,以下是执行效果图









  • 相关阅读:
    随堂笔记 17day
    随堂笔记16day
    随堂笔记day15 python
    随堂笔记14day python
    随堂笔记12day python
    随堂笔记python 11day 补
    java
    微信小程序入门
    #JS# 如何判断一个字符串是否为日期格式
    JS如何按时间粒度获取date的时间差
  • 原文地址:https://www.cnblogs.com/brucemengbm/p/6813557.html
Copyright © 2011-2022 走看看