WebView与Js互调

1.添加权限

<uses-permission android:name="android.permission.INTERNET"/>

2.布局

<?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:id="@+id/activity_main"
    android:layout_width="match_parent" android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.webviewjs.MainActivity"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <EditText
            android:id="@+id/edi"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:singleLine="true"
            android:hint="请输入要加载的网址"/>
        <Button
            android:onClick="load"
            android:id="@+id/but"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="点击加载"
            />

    </LinearLayout>
    <ProgressBar
        android:id="@+id/progress"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:max="100"
        android:visibility="gone"
        style="?android:attr/progressBarStyleHorizontal"/>
    <WebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1">

    </WebView>
    <Button
        android:onClick="js"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="调用JS方法"/>
</LinearLayout>

3.重要操作（我是导入了一个html文件到assets下，我们做项目时要用网络数据）

package com.example.webviewjs;

import android.content.res.ObbInfo;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.webkit.JavascriptInterface;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Button;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    private WebView webView;
    private static final String HTML_URL = "file:///android_asset/test.html";

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        webView = (WebView) findViewById(R.id.webview);

 //通过webview对象获取WebSettings对象
        WebSettings settings = webView.getSettings();
        settings.setJavaScriptEnabled(true);
        settings.setSupportZoom(true);

        webView.setWebViewClient(new WebViewClient(){
            /**
             * 给WebView加一个事件监听对象（WebViewClient)并重写shouldOverrideUrlLoading，
             * 可以对网页中超链接按钮的响应f
             * 当按下某个连接时WebViewClient会调用这个方法，并传递参数：当前响应的的url地址
             */
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                // 此处可添加一些逻辑：是否拦截此url，自行处理
                // 在当前的webview中跳转到新的url
                view.loadUrl(url);
                return true;
            }
        });

        //Android端定义一个方法，给js调用
// 使用webView对象,调用addJavascriptInterface方法(),
// 第一个参数是写一个类,方法前最好加一个注解:@JavascriptInterface,
// 第二个参数是标识字符串,js通过这个标识,调用我们的方法.   
 //在js里面是这样使用的:Android.showToast(content);
        webView.addJavascriptInterface(new Object(){
            @JavascriptInterface
            public void showToast(String content){
                Toast.makeText(getApplicationContext(),content,Toast.LENGTH_LONG).show();
            }
        },"Android");

    }
    //  加载本地的文件.
    public void load(View v){

        webView.loadUrl(HTML_URL);
    }
    public void js(View view){
        webView.loadUrl("javascript:changeInputValue('对酒当歌，人生几何')");
    }
}

Html文件（用这个要建一个后缀名为html的文件粘贴进去，然后创建assets文件夹，导入）

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>

<script type="text/javascript">
    function showAndroidToast(toast) {
        Android.showToast(toast);
    }
    
    function changeInputValue(content){
       document.getElementById("put_id").value=content;
       
    }
    
</script>

</head>
<body>
<input type="button" value="Say hello" onClick="showAndroidToast('你好')" />
<input type="text" value="aa" id="put_id" />
</body>
</html>

实现效果：