在android中实现webview与纯JavaScript的交互

1>首先说说,WebView如何加载页面:
直接加载网页、图片并显示
如果是在assert 目录下：地址为file:///android_asset/jstest.html
2>wevView常用的设置属性
WebView settings = webView.getSettings();//获得当前webView的设置对象
settings.setSupportZoom(true);//设置为支持缩放
settings.setDefaultZoom(ZoomDensity.FAR);//设置webView的默认缩放
settings.setJavaScriptEnabled(true);//设置为支持javaScript
settings.setPluginsEnabled(true);//设置为支持插件，如flashPlayer插件
settings.setBuiltInZoomControls(true);// 打开自带的缩放按钮
3> WebView中支持js弹框
3.1 WebView中支持alert弹框,需进行如下设置即可

WebSettings s = wv.getSettings();
		s.setJavaScriptEnabled(true);// 允许js代码允许
		// 不会打开模拟器的浏览器
		wv.setWebViewClient(new WebViewClient());
		wv.setWebChromeClient(new WebChromeClient() {
			@Override
			public boolean onJsAlert(WebView view, String url, String message,
					JsResult result) {
				return super.onJsAlert(view, url, message, result);
			}

		});

3.2 android中webview控件调用javascript代码,在android中输入的内容输出到js的框中

  public void callJs(View v) {
		wv.loadUrl("javascript:aa('hello 我是Android')");
	}

4> javascript调用android中自定义好的方法,若用户名和密码输入正确,则把用户名和密码保存到sp对象中,需要给webview控件添加addJavascriptInterface方法，而这个就类似于初始化一个类对象，以及类对象里的方法。这个类对象就提供给javascript来调用;

private WebView wv;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		// webview控件
		wv = (WebView) findViewById(R.id.webView1);
		set();
		// 不会打开模拟器的浏览器
		wv.setWebViewClient(new WebViewClient());
		wv.setWebChromeClient(new WebChromeClient() {
			@Override
			public boolean onJsAlert(WebView view, String url, String message,
					JsResult result) {
				return super.onJsAlert(view, url, message, result);
			}

		});
                //给js调用提供的接口
		wv.addJavascriptInterface(new Object() {
			@android.webkit.JavascriptInterface
			public void info(String str1, String str2) {
				Toast.makeText(MainActivity.this, "从js页面取回的用户名:"+str1+";密码:"+str2, 0).show();
			}
		}, "javacode");// 参数一: 参数二:js提供对象名
		wv.loadUrl("file:///android_asset/form.html");
	}

	//初始化webSettings的配置参数
	public void set() {
		WebSettings s = wv.getSettings();
		s.setJavaScriptEnabled(true);// 允许js代码允许
	}

3.2 javascript调用自定义好的JShare对象

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
 
<script language="javascript">
function test(){

   if(document.login.uname.value==""){

    alert("用户名不能为空!");
   }else if(document.login.upass.value==""){

	alert("密码不能为空!");	 
	}else{

	alert("成功登录跳转Activity!");	
	 //js调用Android代码,进行跳转操作
	 window.javacode.info(document.login.uname.value,document.login.upass.value);
	}
	}
	
	function aa(str){
		alert(str)
	}
</script>
</head>

<body>
<form  action="" name="login" >
 
姓名： <input type="text" name="uname"/> <br/>
密码： <input type="password" name="upass"  /> <br/>
<input type="button" onClick="test()" value="登录"/>
</form>
 
 
</form> 
</body>
</html>

在android中实现webview与纯JavaScript的交互

猜你喜欢