android 与html交互java调js与js调java操作

1.首先在项目下建一个assets目录(右击app->New->Folder->Assets Flolder)，直接放在项目根目录下和res目录同级别（把所html，js,图片,css等所有网页相关放在这个目录下）r

 

2.建一个test.html文件代码如下

<html>

<script>
        function callJS(arg){
            document.getElementById('replaceme').innerHTML=arg;
            alert("arg="+arg);
        } //Android后台java会来调用它
    </script>
<body>
<a href="#"  onclick="window.alert('AlertfromJavaScript')">
        alert调用toast</a><br>
    
    <a href="#" onclick="window.android.callAndroid('HellofromBrowser')">
        js调用java方法</a><br>
    <a href="#" onclick="window.android.callAndroid222('HellofromBrowser2222','333')">
        js调用java方法2</a>
    <!--//js通过自己定义“android"接口来调用java类中的方法，"android"可以改成任意的，但必须和java中设置的接口名一致-->
    <br />
    <p id="replaceme">
    </p>
<body>
</html>

3.layout文件如下

<WebView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/webView"
        android:layout_below="@+id/btnUrlShow" />




<Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="java调用js方法"
        android:id="@+id/bt4"
        android:layout_below="@+id/bt3"
        android:layout_alignLeft="@+id/bt3"
        android:layout_alignStart="@+id/bt3" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="用来显示html调用的值"
        android:id="@+id/textView5"
        android:layout_centerVertical="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"/>

4.activity代码如下

 

public class WebViewActivity extends Activity  {
private Button sendRequest,bt4;
private TextView responseText,textView5;


private final Handler handler=new Handler();//只有用handel才能修改android控件的值
    private class AndroidBridge //这个类中提供各种js可调用的方法。
    {
        @JavascriptInterface
        public void callAndroid(final String arg)
        {
            handler.post(new Runnable(){
                public void run()
                {
                    Log.d("ZW", "calAndroid("+arg+")");
                    textView5.setText(arg);
                }
            });
        }

        @JavascriptInterface
        public void callAndroid222(final String arg,final  String arg2)
        {
            handler.post(new Runnable(){
                public void run()
                {
                    Log.d("zwzw", "callAndroid222("+arg+","+arg2+")");
                    textView5.setText(arg);
                }
            });
        }
    }



  @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_web_view);
    textView5=(TextView)findViewById(R.id.textView5);
    
     webView = (WebView) findViewById(R.id.webView);
        webView.getSettings().setJavaScriptEnabled(true);//让web可以运行js
    String url="file:///android_asset/test.html";
    webView.loadUrl(url);


   
        webView.addJavascriptInterface(new AndroidBridge(), "android"); //将那个实例化的函数类设置为”android"的js接口这个。这里什么android名字前台js调用就用什么,比如这这里给名字为abc,html中调用就用onclick="window.abc.callAndroid(...."

        //覆盖重写html中js的alert方法,还可以覆盖重写别的方法，可以转到定义去查。。
        webView.setWebChromeClient(new WebChromeClient() {
            @Override
            public boolean onJsAlert(WebView view, String url, String message, JsResult result) {

                Log.d("ZW", "onJsAlert(" + view + "," + url + "," + message + "," + result + ")");
                Toast.makeText(WebViewActivity.this, message, Toast.LENGTH_SHORT).show();
                result.confirm();
                return true;
            }

        });//设置可以被java截获的js事件。

        //点android控件调用js方法
　　　　 bt4=(Button)findViewById(R.id.bt4);

        bt4.setOnClickListener(new View.OnClickListener() {
            public void onClick(View v) {
                Log.d("ZW", "onClick(" + v + ")");
                webView.loadUrl("javascript:callJS('hello from android')");  //java调用js的函数
            }
        });
    }
}

 

posted @ 2016-04-19 20:51  为乐而来  阅读(4171)  评论(0)  编辑  收藏  举报