android 调用js中的方法

最新推荐文章于 2024-07-24 11:23:56 发布

A一剑飞鸿

最新推荐文章于 2024-07-24 11:23:56 发布

阅读量379

点赞数

分类专栏： Android android学习总结文章标签： android

本文链接：https://blog.csdn.net/gsg8709/article/details/79035625

版权

Android 同时被 2 个专栏收录

52 篇文章 0 订阅

订阅专栏

android学习总结

33 篇文章 3 订阅

订阅专栏

Android中可以使用WebView加载网页，同时Android端的java代码可以与网页上的javascript代码之间相互调用。

一 Android部分：

 布局代码：

 <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:focusable="true"
android:focusableInTouchMode="true"
android:orientation="vertical"
android:padding="8dp"
tools:context=".MainActivity">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <EditText
        android:id="@+id/input_et"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:singleLine="true"
        android:layout_weight="1"
        android:hint="请输入信息" />

    <Button
        android:text="Java调用JS"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="sendInfoToJs" />
</LinearLayout>

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

Activity代码：

public class MainActivity extends AppCompatActivity {
    private WebView webView;

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

        webView.setVerticalScrollbarOverlay(true);
        //设置WebView支持JavaScript
        webView.getSettings().setJavaScriptEnabled(true);

        webView.loadUrl("file:///android_asset/webview.html");
        //在js中调用本地java方法
        webView.addJavascriptInterface(new JsInterface(this), "AndroidWebView");

//        //添加客户端支持
        webView.setWebChromeClient(new WebChromeClient());


    }
    private class JsInterface {
        private Context mContext;

        public JsInterface(Context context) {
            this.mContext = context;
        }

        //在js中调用window.AndroidWebView.showInfoFromJs(name)，便会触发此方法。
        @JavascriptInterface
        public void showInfoFromJs(String name) {
            Toast.makeText(mContext, name, Toast.LENGTH_SHORT).show();
        }
    }

    //在java中调用js代码
    public void sendInfoToJs(View view) {

        String msg = ((EditText) findViewById(R.id.input_et)).getText().toString();
        //调用js中的函数：showInfoFromJava(msg)
        webView.loadUrl("javascript:showInfoFromJava('" + msg + "')");
//        webView.loadUrl("javascript:showInfoFromJava()");
    }
}

二网页代码

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>Android WebView 与 Javascript 交互</title>

</head>
<body>
<input type="button" value="分享" onclick="f1()">

<input type="text" id="show"/>


</body>

   <script>


      function f1(){
         AndroidWebView.showInfoFromJs("hello");


      }

          function showInfoFromJava(msg){
        document.getElementById("show").value=msg;
        alert(1);
      }





   </script>
</html>

注意: android 调用js代码可能会报错如下：
W/WebView(2088): java.lang.Throwable: A WebView method was called on thread ‘JavaBridge’. All WebView methods must be called on the same thread.

解决办法：

webView.post(new Runnable() {
    @Override
    public void run() {

      webView.loadUrl("javascript:showInfoFromJava('" + msg + "')");
    }});

A一剑飞鸿

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录