This article mainly summarizes the simple method of invoking Android and JS to each other.
In the development process encountered the need to call the JS method in wirelessly needs, so the specific implementation process is always formed this blog.
Where the "call the Android Method" button is the HTML button; the "Invoke JS Method" button is the button in the app.
First, create a new assets folder in the app root directory and create a new local HTML file within the folder, such as
Then write a simple HTML file:
<html lang="zh-CN">
<p id='p'>hello world</p>
<script>
function test(){
document.getElementById("p").innerHTML += " 你好！"
}
</script>
<button onclick="justTest.hello('js调用安卓方法！')">调用安卓方法</button>
</html>
Android Layout file:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<WebView
android:id="@+id/webview"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<Button
android:id="@+id/btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Call the js method" />
</LinearLayout>
Android Call JS Method:
As you can see, there is already a test function in the local HTML, and the test function is called in wirelessly.
1 webView = findViewById(R.id.webview); 2 webView.getSettings().setJavaScriptEnabled(true); 3 webView.loadUrl("file:///android_asset/show.html");
Button btn = findViewById(R.id.btn); btn.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { testJS(); } });
Where the Testjs code is:
1 @SuppressLint("SetJavaScriptEnabled") 2 public void testJS() { 3 webView.loadUrl("javascript:test()"); 4 }
On this basis, the implementation of the Android call JS method.
And you need to bind the Java object to WebView:1 @JavascriptInterface 2 public void hello(String msg) { 3 Toast.makeText(this, msg, Toast.LENGTH_SHORT).show(); 4 }
Finally, this method is called in JS:1 webview.addjavascriptinterface (This, "justtest");
<button onclick = "justTest.hello ('js call Android method!')"> call Android method </ button>
This makes it possible to invoke the Android method in JS.
Because the work is busy, long time did not write the blog.
I will take time to summarize what I have learned at work.
This blog wrote a very simple demo, but Android and JS call each other in the actual development is very useful, specifically to do a summary.
If you have any questions or suggestions can be comments or e-mail to contact me, welcome comments ~
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
