您的位置：首页 > 移动开发 > Android开发

Android WebView js与Java调用实例

2014-04-09 11:20 435 查看

本文讲解了JavaScript与Java之间的相互的调用的一个小例子，该知识点在实际开发中经常用到。

布局文件main：

<?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/webview"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="9" />

    <ScrollView
        android:id="@+id/scrollView1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" >

        <TextView
            android:id="@+id/textView"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="text" />
    </ScrollView>

    <Button
        android:id="@+id/button1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="java调用js函数-无参" />

    <Button
        android:id="@+id/button2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="java调用js函数-有参" />

</LinearLayout>

MainActivity：

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.WebView;
import android.widget.Button;
import android.widget.TextView;
import android.widget.Toast;

@SuppressWarnings("unused")
public class MainActivity extends Activity {

	private WebView webView = null;
	private TextView textView = null;
	private Button button1, button2;

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

		button1 = (Button) findViewById(R.id.button1);
		button2 = (Button) findViewById(R.id.button2);
		button1.setOnClickListener(btnClickListener1);
		button2.setOnClickListener(btnClickListener2);
		webView.addJavascriptInterface(this, "wst");
	}
	
	/**
	 * Java调用js函数--无参数调用
	 */
	OnClickListener btnClickListener1 = new Button.OnClickListener() {
		public void onClick(View v) {
			// 无参数调用
			webView.loadUrl("javascript:javacalljs()");
		}
	};

	/**
	 * Java调用js函数--有参调用
	 */
	OnClickListener btnClickListener2 = new Button.OnClickListener() {
		public void onClick(View v) {
			// 传递参数调用
			webView.loadUrl("javascript:javacalljswithargs("
					+ "'hello world****'" + ")");
		}
	};

	/**
	 * js调用Java函数--无参
	 */
	public void startFunction() {
		runOnUiThread(new Runnable() {

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

			}
		});
	}
	
	/**
	 * js调用了Java函数--有参
	 * @param str
	 */
	public void startFunction(final String str) {
		runOnUiThread(new Runnable() {

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

			}
		});
	}
}

assets目录下的myfile.html源码：

<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\>java调用了js函数--参数为："+arg);
}

</script>
</head>
<body>
牛奶咖啡 <br/>
<a onClick="window.wst.startFunction()">点击调用java代码*</a><br/>
<a onClick="window.wst.startFunction('hello world***')" >点击调用java代码并传递参数*</a>
<br/>
<div id="content">内容显示*</div>
</body>
</html>

源码下载：

http://download.csdn.net/detail/u012440207/7165455

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航