Implement the interaction between webview and pure JavaScript in android

1> First of all, let's talk about how WebView loads the page:
directly load the web page, picture and display
If it is in the assert directory: the address is file:///android_asset/jstest.html
2> WevView commonly used setting attributes
WebView settings = webView.getSettings ();//Get the setting object of the current webView
settings.setSupportZoom(true);//Set to support zoom
settings.setDefaultZoom(ZoomDensity.FAR);//Set the default zoom of the webView
settings.setJavaScriptEnabled(true);//Settings To support javaScript
settings.setPluginsEnabled(true);//Set to support plug-ins, such as flashPlayer plug-in
settings.setBuiltInZoomControls(true);// Open the built-in zoom button
3> Support js pop-up
in WebView 3.1 Support alert pop-up in WebView , the following settings are required

WebSettings s = wv.getSettings();
		s.setJavaScriptEnabled(true);// Allow js code to allow
		// won't open the emulator's browser
		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 The webview control in android calls javascript code, and the content entered in android is output to the js box

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

4> javascript calls the custom method in android. If the user name and password are entered correctly, the user name and password are saved in the sp object, and the addJavascriptInterface method needs to be added to the webview control, which is similar to initializing a class object and class methods in the object. This class object is provided to javascript to call;

private WebView wv;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate (savedInstanceState);
		setContentView(R.layout.activity_main);
		// webview control
		wv = (WebView) findViewById(R.id.webView1);
		set();
		// won't open the emulator's browser
		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);
			}

		});
                //Interface provided for js call
		wv.addJavascriptInterface(new Object() {
			@android.webkit.JavascriptInterface
			public void info(String str1, String str2) {
				Toast.makeText(MainActivity.this, "Username retrieved from js page:"+str1+";Password:"+str2, 0).show();
			}
		}, "javacode");// Parameter 1: Parameter 2: js provides object name
		wv.loadUrl("file:///android_asset/form.html");
	}

	//Initialize the configuration parameters of webSettings
	public void set() {
		WebSettings s = wv.getSettings();
		s.setJavaScriptEnabled(true);// Allow js code to allow
	}

3.2 javascript calls the customized JShare object

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled document</title>
 
<script language="javascript">
function test(){

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

    alert("Username cannot be empty!");
   }else if(document.login.upass.value==""){

	alert("Password cannot be empty!");	 
	}else{

	alert("Successfully logged in to jump to Activity!");	
	 //js calls Android code to perform jump operation
	 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>

Implement the interaction between webview and pure JavaScript in android

Guess you like