• Android与JS互相调用以及注意


    近期项目中常常使用Html5而Android与JS调用常常会用到,这里记录一下,測试系统5.0以上。

    这里先贴一下源代码

    Activity:

    package jwzhangjie.com.webviewandjs;
    
    import android.content.Context;
    import android.support.v7.app.AppCompatActivity;
    import android.os.Bundle;
    import android.view.View;
    import android.webkit.JavascriptInterface;
    import android.webkit.WebView;
    import android.webkit.WebViewClient;
    import android.widget.Toast;
    
    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);
            initWebView();
        }
    
        private void initWebView(){
            //设置编码
            webView.getSettings().setDefaultTextEncodingName("utf-8");
            //支持js
            webView.getSettings().setJavaScriptEnabled(true);
            //设置监听事件
            webView.setWebViewClient(new JieWewViewClient());
            //设置本地调用对象及其接口
            webView.addJavascriptInterface(new JavaScriptObject(getApplicationContext()), "toAndroid");
            //载入js
            webView.loadUrl("file:///android_asset/index.html");
        }
    
        public void javaCallJsNoParams(View view){
            webView.loadUrl("javascript:javaCallJsNoParamsMethod()");
        }
    
        public void javaCallJsHasParams(View view){
            webView.loadUrl("javascript:javaCallJsHasParamsMethod('" + 123 + "')");
        }
    
        public class JavaScriptObject {
    
            Context mContxt;
    
            public JavaScriptObject(Context mContxt) {
                this.mContxt = mContxt;
            }
    
            @JavascriptInterface //sdk17版本号以上加上注解
            public void jsCallJavaNoParams() {
                Toast.makeText(mContxt, "Js调用Java方法(无參)", Toast.LENGTH_LONG).show();
            }
    
            @JavascriptInterface //sdk17版本号以上加上注解
            public void jsCallJavaHasParams(String params) {
                Toast.makeText(mContxt, "Js调用Java方法(有參):" + params, Toast.LENGTH_SHORT).show();
            }
        }
    
        class JieWewViewClient extends WebViewClient{
            /**
             *  假设紧跟着
             *  webView.loadUrl("file:///android_asset/index.html");
             *  调用Js中的方法是不起作用的,必须页面载入完毕才干够
             */
    
            @Override
            public void onPageFinished(WebView view, String url) {
                super.onPageFinished(view, url);
                webView.loadUrl("javascript:javaCallJsHasParamsMethod('" + 123 + "')");
            }
        }
    
    }
    

    html:

    <!DOCTYPE HTML>
    <HTML>
        <HEAD>
            <meta charset="utf-8">
            <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
        </HEAD>
        <BODY>
            <div>
                <input type="text" id="showText" style="100%;height:100px;margin-bottom:10px" readonly>
                <input type="button" onclick="jsCallJavaNoParamsMethod()" value="Js调用Java方法(无參)">
                <input type="button" onclick="jsCallJavaHasParamsMethod('成功了')" value="Js调用Java方法(有參)">
            </div>
        </BODY>
        <script type="text/javascript" src="jquery.min.js"></script>
        <script type="text/javascript">
            function javaCallJsNoParamsMethod(){
                   $('#showText').val("Java调用js方法,无參数");
            }
    
            function javaCallJsHasParamsMethod(params){
                   $('#showText').val("Java调用Js方法。有參数:"+params);
            }
    
            function jsCallJavaNoParamsMethod(){
                   toAndroid.jsCallJavaNoParams();
            }
    
            function jsCallJavaHasParamsMethod(params){
                   toAndroid.jsCallJavaHasParams(params);
            }
        </script>
    </HTML>
    界面:


    注意点:

    1、Android系统17以及以上,js调用java须要在方法上面增加@JavascriptInterface

    2、不能在载入html页面的以下直接调用js方法,应该在WebViewClient的onPageFinished里面载入,原则就是必须html载入完毕后。才干调用js中的方法。


    源代码:http://download.csdn.net/download/jwzhangjie/9020941 


  • 相关阅读:
    服务器和虚拟机怎么安装Kaldi?
    SHSSS丨从人设到音色——基于说话人属性特征的语音合成
    Vue生命周期钩子
    快速入门React(基础)
    [Vue warn]: Failed to resolve filter: xxxxxxx
    Node.js express 连接数据库
    项目本地预览
    vue配置启动项目自动打开浏览器
    css 实现div内显示两行或三行,超出部分用省略号显示
    VSCode格式化代码配置
  • 原文地址:https://www.cnblogs.com/lxjshuju/p/6979753.html
Copyright © 2020-2023  润新知