HTML Links Not Working (Using Base Href)

base href to / - now href to IDs not working

Try:

$(document).ready(function() {
    var pathname = window.location.href.split('#')[0];
    $('a[href^="#"]').each(function() {
        var $this = $(this),
            link = $this.attr('href');
        $this.attr('href', pathname + link);
    });
});

which will fix all links or (without jQuery) on individual links:

<a href="javascript:;" onclick="document.location.hash='anchor';">Anchor</a>

Source: Make anchor links refer to the current page when using <base>

Base tag not working correctly

I had a similar problem. The problem occurred when the page was fed through a cgi. This did not work for me:

<base href="http://example.com/dev/">

but, the following does:

<base href="/dev/">

HTML Base href not taken into account for link static resources and CSS

What I'm doing wrong?

You did not specify the correct base href to begin with.

<base href="/myapp">

So this is effectively the same, as if you were on http://example.com/myapp to begin with (without specifying base), and relative URLs would be resolve based on that initial address.

Now think about it, if you resolve the relative URL ./assets/forms.css based on the above base URL, what will the result be? http://example.com/assets/forms.css of course.

What you need is therefor

<base href="/myapp/">

with a trailing slash, to make this a “folder” to begin with.

Adding base tag href with Javascript doesn't work

Thanks for all responses. I found a solution that works in my case, and the important thing was to not add the BASE-tag itself with JavaScript, instead only modify the href attrubute. If I added the tag with JavaScript it wouldn't work in most browsers for my solution. The following code modifies the href value with JavaScript to make it absolute based on current domain and it works fine in both Chrome and IE9...

<head>  <base href="app/" />  <script>    (function() {      // Fetch base element and href attribute      var baseElement = document.getElementsByTagName('base')[0];      var currentBaseHrefValue = baseElement.getAttribute('href');
      // Get correct domain value      var urlForBase = window.location.href;      var urlForBaseArr = urlForBase.split('/');      var baseHrefUrl = urlForBaseArr[0] + '//' + urlForBaseArr[2] + '/' + currentBaseHrefValue;
      // Update base with domain to make it absolute for IE9 and IE10      baseElement.setAttribute("href", baseHrefUrl);    }());  </script></head>

HTML Links Not Working (Using Base Href)

base href to / - now href to IDs not working

Base tag not working correctly

HTML Base href not taken into account for link static resources and CSS

Adding base tag href with Javascript doesn't work

Related Topics

Leave a reply