Android WebView 与 javascript交互

 有些时候为了偷懒或者业务需求,App里有时候是套网页的,好比PC 版的 QQ音乐库。点击网页里的播放为啥软件就会响应呢?道理是一样的,只不过现在主角是 Android 而已。

    webView 和 javascript 交互,也就是相互调用对方的方法,也就叫做 混合开发,是不是瞬间感觉高大上了。刚开始随意百度了一下,都是坑人的东西,各种代码不全有问题。谷歌

之后才看明白了,其实用起来很简单。

首先我们需要一个html5代码。这里我自己先建一个 html5 页面:



	
		
			
			
			
		
	
	

		
	

 activity布局



    
    
MainActivity.java

package com.example.webview_javascript;

import android.annotation.SuppressLint;
import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.View.OnClickListener;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Button;

@SuppressLint("SetJavaScriptEnabled")
public class MainActivity extends Activity {

	private WebView web;
	private Button showJsMethod;
	private Button shuaxin;
 
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		web = (WebView) findViewById(R.id.webView);
		showJsMethod = (Button) findViewById(R.id.showJsMethod);
		shuaxin = (Button) findViewById(R.id.shuaxin);

		shuaxin.setOnClickListener(new OnClickListener() {

			@Override
			public void onClick(View v) {

				web.loadUrl("http://192.168.0.2:8020/HelloHBuilder/index.html");
			}
		});

		showJsMethod.setOnClickListener(new OnClickListener() {

			@Override
			public void onClick(View v) {
				web.loadUrl("javascript:showMsg(\"我是Android调用的\")");

			}
		});

		WebSettings webSettings = web.getSettings();
		web.setWebChromeClient(new WebChromeClient() {
		});
		webSettings.setJavaScriptEnabled(true);
		webSettings.setSupportZoom(false);
		web.loadUrl("http://192.168.0.2:8020/HelloHBuilder/index.html");
		web.addJavascriptInterface(new DemoJavaScriptInterface(this, web),
				"demo");
		web.setWebViewClient(new WebViewClient() {
			@Override
			public void onPageFinished(WebView view, String url) {
				super.onPageFinished(view, url);
				// 在这里执行你想调用的js函数
				Log.i("", "web_网页加载完成");
			}
		});
	}

}

DemoJavaScriptInterface.java

package com.example.webview_javascript;

import android.content.Context;
import android.os.Handler;
import android.webkit.JavascriptInterface;
import android.webkit.WebView;
import android.widget.Toast;

public class DemoJavaScriptInterface {

	private Context context;
	private WebView web;
	private Handler mHandler = new Handler();
	
    DemoJavaScriptInterface(Context context,WebView web) {
    	this.context = context;
    	this.web = web;
    }

    /**
     * This is not called on the UI thread. Post a runnable to invoke
     * loadUrl on the UI thread.
     */
    @JavascriptInterface
    public void clickOnAndroid() {
    	Toast.makeText(context, "点击了", Toast.LENGTH_SHORT).show();
    	
    	

    }
}

注意 : web.addJavascriptInterface(new DemoJavaScriptInterface(this, web),"demo");

上面的demo 可以说是把 接口开放给js 并且起个名字, js里 就可以   来调用,一般情况下,如果想要获取 js 之后过后的返回值,可以通过js调用java方法传回来。如果发现alert 弹不出来 请确保 你是 在 网页加载完成后调用的。








你可能感兴趣的:(Android WebView 与 javascript交互)