Android Webview Anchor Link (Jump link) not workin

问题:

I have a WebView in my Android App that is loading an HTML string using the loadDataWithBaseURL() method. The problem is that local anchor links (<a href="#link">...) are not working correctly. When the link is clicked, it becomes highlighted, but does not scroll to the corresponding anchor.

This also does not work if I use the WebView's loadUrl() method to load a page that contains anchor links. However, if I load the same URL in the browser, the anchor links do work.

Is there any special handling required to get these to work for a WebView?

I am using API v4 (1.6).

There isn't much to the code, here are the relevant parts of some test code I've been working with:

WebView detailBody = (WebView) findViewById(R.id.article_detail_body);
String s = "<a href=\"#link\">LINK!</a><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><a name=\"link\"></a>Testing!";
detailBody.loadDataWithBaseURL(API.HomeURL(this), s, "text/html", "utf-8", "");

回答1:

It looks like the problem is that I had a WebView within a ScrollView. The WebView isn't able to scroll to an anchor link when configured like this. After refactoring my layout to eliminate the ScrollView, the anchor links work correctly.

回答2:

Android Webview Anchor Link (Jump link) Not Working

True, WebView Anchor Links, or Jump Links initiated through the #LINK extension to the URL will not work when the WebView is inside of a ScrollView(*).

Still, the problem for me and apparently others is that the #LINK does work when launched from a touch in an href, but is ignored when launched via the URL. Other symptoms include navigating to the link only on the first time in a session or navigating to the bottom of the html file.

The Solution is to load the url after a short delay.

Here is an example:

My html is saved in assets: res/assets/help.html

With anchors like this:

<a name="helplinkcontacts"/>

And loaded like this:

final String baseUrl = "file:///android_asset/help.html#helplinkcontacts";
final WebView helpTextView = (WebView)findViewById(R.id.help_dialog_text);
helpTextView.loadUrl(baseUrl); // Ignores Anchor!!

I added the timer like this:

final String baseUrl = "file:///android_asset/help.html#helplinkcontacts";
final WebView helpTextView = (WebView)findViewById(R.id.help_dialog_text);
Timer timer = new Timer();
timer.schedule(new TimerTask() {
    @Override
    public void run() {
        helpTextView.loadUrl(baseUrl);
    }
}, 400);

Note: Shorter delays, such as 100ms failed to navigate to the link.

(*) It turns out that so many of us have our WebViews inside of ScrollViews because we started out with a TextView rendering Spannable text which both supports some HTML and requires a ScrollView. Anyways, remove the ScrollView as soon as you convert your TextView into a WebView.

回答3:

My Solution is , Check this Answer

public class MainActivity extends Activity { 
    WebView myWebView; 
    public static boolean flag = false; 
    @Override 
    public void onCreate(Bundle savedInstanceState) { 
        super.onCreate(savedInstanceState); 
        myWebView = new WebView(this); 
        myWebView.getSettings().setJavaScriptEnabled(true); 
        myWebView.loadUrl("file:///android_asset/chapters.html"); 
        setContentView(myWebView); 
        myWebView.setWebViewClient(new WebViewClient() { 
            public void onPageFinished(WebView view, String url) { 
                if (url.contains("#") && flag == false) { 
                    myWebView.loadUrl(url); 
                    flag = true; 
                } else { 
                    flag = false; 
                } 
            } 

        }); 
    } 
} 

回答4:

I had a similar problem. Nothing would jump to anchor tags in the html. I didn't have my WebView within a ScrollView. Instead the problem was the base url I passed into loadDataWithBaseURL did not have a colon (':') in it. I believe the baseUrl needs to have some text, then a colon, then some more text, for example "app:htmlPage24".

So here's the initial call to my WebView, just to load the data in the string HTML_24:

wv.loadDataWithBaseURL("app:htmlPage24", HTML_24, "text/html", "utf-8", null);

Then I have a list that jumps to sections on the screen, depending on the list item you tap:

sectionsLV.setOnItemClickListener(new OnItemClickListener()
{
    public void onItemClick(AdapterView<?> arg0, View arg1, int arg2, long arg3)
    {
        wv.loadUrl("app:htmlPage24#section" + arg2);
    }
});

HTML_24 is something like:

<html>
...
<a name="section1"/>

...
<a name="section2"/>

...
<a name="section3"/>

...
</html>

回答5:

WebView in Android 4.0 fails to open URLs with links in them. e.g. "file:///android_asset/help.html#helplinkcontacts"

Here is how I got around it

WebView wv = (WebView) nagDialog.findViewById(R.id.wv);
wv.getSettings().setJavaScriptEnabled(true);
wv.setWebViewClient(new MyWebViewClient(link));
wv.loadUrl("file:///android_asset/help.html");

And define the custom WebViewClient class

class MyWebViewClient extends WebViewClient {
    private String link;

    public MyWebViewClient(String link) {
        this.link = link;
    }

    @Override
    public void onPageFinished(WebView view, String url) {
        if (!"".equals(link) && link != null)
            view.loadUrl("javascript:location.hash = '#" + link + "';");
    }
}

回答6:

try this

String myTemplate = "<a href=\"#link\">LINK!</a><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><a name=\"link\"></a>Testing!";

myWebView.loadDataWithBaseURL(null, myTemplate, "text/html", "utf-8", null);

the word "Testing!" must be outside of the screen to see it works.

回答7:

I was also facing the same issue. Anchor link was jumping to arbitrary position. Make sure not to hide webview when loading.

Use Invisible instead of gone.

This change fixed my issue.