android webview用法小結2 java與javascript的交互

先提下兩種方式

 方式一:

//先加載html文件,然後調用html文件中的javascript函數 

webView.loadUrl("file:///android_asset/show.html"); 

webView.loadUrl("javascript:pushNewsData('"+strHtml+"')");    

   方式二:

//在Java代碼中添加javascript的接口,然後在html文件中調用java中的對象  

webView.addJavascriptInterface(strHtml, "MyContent");


先讓瀏覽器支持javascript

webView.getSettings().setJavaScriptEnabled(true);//打開就可以用js的功能

Js代碼,放在asset文件夾下,也可以在服務器端,這樣改變內容,只需改服務器端,客戶端不用修改

<!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=UTF-8">
<title>Insert title here</title>

<script type="text/javascript">
	function btn_test() {
/* 打印,logcat裏的tag是Web Console */
		console.log("btn_test");
	}

	function call_java() {
/* js調用java代碼,需要接口 */
		Window.interface_test.showToastFromWeb("hello i am javascript!");
	}

	function test_alert() {
/* 彈出對話框 */
		alert("hello i am javascript!");
	}

	function test_confirm() {
		/* 彈出帶確定和取消按鈕的對話框 */
	var v = confirm("hello i am javascript!");
		console.log("onfirm " + v);
	}

	function test_prompt() {
/* 彈出帶輸入框的對話框 */
		var v = prompt("input you name!", "tom");
		console.log("prompt " + v);
	}
	
</script>
</head>
<body>
	<button οnclick="btn_test()">test</button>
	<button οnclick="call_java()">call_java</button>
	<button οnclick="test_alert()">test_alert</button>
	<button οnclick="test_confirm()">test_confirm</button>
	<button οnclick="test_prompt()">test_prompt</button>
	<label tel:800800284>tel:8008233</label>

</body>
</html>

Java代碼裏

對應call_java()方法

webView.addJavascriptInterface(new Object(){
			public void showToastFromWeb(String msg){
				showToast(msg);
			}
		}, "interface_test");

對應alert等方法

webView.setWebChromeClient(new WebChromeClient(){

			@Override
			public void onProgressChanged(WebView view, int 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);
			}
						
		});

加載html

//			webView.loadUrl("javascript:btn_test()");
			webView.loadUrl("file:///android_asset/test.html");

效果圖



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章