Android WebView加载本地文件，使用JavaScript定位到指定位置

来源：互联网发布：网络病毒的危害编辑：程序博客网时间：2024/04/30 10:42

先上截图，点击左图某一条item，跳到右图滚动到对应位置

1，html代码

<!DOCTYPE html><html><head><title>常见问题</title><meta content="text/html; charset=UTF-8" http-equiv="Content-Type" /><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1"><meta name="format-detection" content="telephone=no"><link rel="stylesheet" type="text/css" href="rule.css"></head><body><div>   <section id="wrapper">      <article id="scroller">         <dl class="dlInfo">            <dt id="a"><p><b>1. 第一条是什么问题？</b></p></dt>            <dd>这是第一条。这是第一条。这是第一条。这是第一条。这是第一条。这是第一条。这是第一条。这是第一条。这是第一条。</dd>            <dt id="b"><p><b> 2. 第二条是什么问题？</b></p></dt>            <dd>这是第二条。这是第二条。这是第二条。这是第二条。这是第二条。这是第二条。这是第二条。</dd>            <dt id="c"> <p><b>3. 第三条是什么问题？</b></p></dt>            <dd>这是第三条。这是第三条。这是第三条。这是第三条。这是第三条。这是第三条。这是第三条。这是第三条。</dd>            <dt id="d"> <p><b>4. 第四条是什么问题？</b></p></dt>            <dd>这是第四条。这是第四条。这是第四条。这是第四条。这是第四条。这是第四条。这是第四条。这是第四条。这是第四条。</dd>            <dt id="e"> <p><b>5. 第五条是什么问题？</b></p></dt>            <dd>这是第五条！这是第五条！这是第五条！这是第五条！这是第五条！这是第五条！这是第五条！</dd>            <dt id="f"><p><b> 6. 第六条是什么问题？</b></p></dt>            <dd>这是第六条。这是第六条。这是第六条。</dd>            <dt id="g"> <p><b>7.  第七条是什么问题？</b></p></dt>                <dd>这是第七条。</dd>         </dl>      </article>   </section></div></body></html>

2，json文件

[  {    "title" : "1.第一条是什么问题？",    "id" : "a"  },  {    "title" : "2.第二条是什么问题？",    "id" : "b"  },  {    "title" : "3.第三条是什么问题？",    "id" : "c"  },  {    "title" : "4.第四条是什么问题？",    "id" : "d"  },  {    "title" : "5.第五条是什么问题？",    "id" : "e"  },  {    "title" : "6.第六条是什么问题？",    "id" : "f"  },  {    "title" : "7.第七条是什么问题？",    "id" : "g"  } ]

3，webview加载本地html文件

webView_faq = (WebView) findViewById(R.id.webView_faq);webView_faq.getSettings().setJavaScriptEnabled(true);//支持jswebView_faq.loadUrl("file:///android_asset/my.html");webView_faq.setWebViewClient(new WebViewClient(){    @RequiresApi(api = Build.VERSION_CODES.KITKAT)    @Override    public void onPageFinished(WebView view, String url) {        super.onPageFinished(view, url);        webView_faq.evaluateJavascript(javascriptStr, new ValueCallback<String>() {            @Override            public void onReceiveValue(String value) {            }        });    }});

3，JavaScript语句

javascriptStr = "javascript:window.location.hash = '#" + id + "';";

tips：常量id为html文件中的id，JavaScript完整语句为：javascript:window.location.hash = "#a;"

4，这个小小的问题让我苦恼挺久的，在网上找了很久也没找到答案，后来是看到一篇关于IOS相同功能的博客，然后自己用webview的好几个方法尝试出来的哈哈，记录一下；

非常感谢那位博主，那篇博客地址：http://www.cnblogs.com/samyangldora/p/4619999.html

阅读全文

0 0