javascript - Webview android 在点击时滚动到特定的 id

Question

我在 android webview 上工作，如果我点击 55 页面必须滚动，数字将从 1-100 列出转到第 55 段，之后我可以向上或向下滚动，我发现我可以用 javascript 实现它我试过类似的东西

 content+="<div id="+i+">";
 i++;
 content += cursor.getString(cursor.getColumnIndex(VERSE_CONTENT));
 content+="</div>";

我为每个段落添加了一个id

和onclick

sample = dbhelper.getMonBookChap(bible, intent_bookid, intent_chapid);
sample = "<div style='line-height:150%;text-align: justify;'>" + sample + "</font></div>";
wv_Content.getSettings().setJavaScriptEnabled(true);
wv_Content.getSettings().setDomStorageEnabled(true);
wv_Content.addJavascriptInterface(new JavaScriptReceiver(this), "Android");
wv_Content.loadUrl("javascript:scrollToElement('" + intent_verseid + "')");

并且我创建了一个JavaScriptReceiver.java类，我不知道将javascript代码放在项目的什么地方。

function scrollToElement(id) {
    var elem = document.getElementById(id);
    var x = 0;
    var y = 0;

    while (elem != null) {
        x += elem.offsetLeft;
        y += elem.offsetTop;
        elem = elem.offsetParent;
    }
    window.scrollTo(x, y);
}

Answer 1

将 javascript 添加到内容变量(您的 html 内容)的开头，在 <script> 中标签。

 String content ="<script>  
    function scrollToElement(id) {
        var elem = document.getElementById(id);
        var x = 0;
        var y = 0;

        while (elem != null) {
            x += elem.offsetLeft;
            y += elem.offsetTop;
            elem = elem.offsetParent;
        }
        window.scrollTo(x, y);
    }
    </script>";

   content += "<div id="+i+">";
     i++;
     content += cursor.getString(cursor.getColumnIndex(VERSE_CONTENT));
     content+="</div>";

还有一个建议，我建议在 js 中处理所有这些，我的意思是单击事件和滚动。不打电话

wv_Content.loadUrl("javascript:scrollToElement('" + intent_verseid + "')");

根本就是给div设置一些class或者id，然后在JS中设置onclick。