Question

Hi I have a page that navigates using anchors. On load the index page (A) needs to jump to anchor. Fine I can do this with on load function but coming back to the page A from page B I want to jump to a different anchor. I have this working:

    <!-- go to Anchor -->
    <script type="text/javascript">

    function goToAnchor() {
    var urllocation = location.href;
    if(urllocation.indexOf("#top") > -1){
        window.location.hash="top";
    } else {
    window.location.hash="middle";
    }
}
    </script>

#middle is the anchor to use when coming from a link that contains no anchor (or from typing the address into the url bar). I want to add three more ‘if’s’. I am fairly new at js so bear with me if I am doing something silly. I tried this:

function goToAnchor() {
    var urllocation = location.href;        
if(urllocation.indexOf("#right") > -1){
        window.location.hash="right"; 
    } else {
    window.location.hash="middle";
    }
    if(urllocation.indexOf("#bottom") > -1){
        window.location.hash="bottom"; 
    } else {
    window.location.hash="middle";
    }
    if(urllocation.indexOf("#left") > -1){
        window.location.hash="left"; 
    } else {
    window.location.hash="middle";
    }

But not joy, the js breaks and no longer goes to #middle on page load.

I tried a wild card approach:

function goToAnchor() {
var urllocation = location.href;
if(urllocation.indexOf("#.") > -1){
    window.location.hash=".";
} else {
window.location.hash="middle";
}

}

Again, no joy.

Any help please.. thanks kindly

Answer 1

I am not quite sure I understand the effect you are trying to achieve (since window.location.hash should already contain the hash part of your url), but your code should probably rather be

function goToAnchor() {
    var urllocation = location.href;        
    if (urllocation.indexOf("#right") > -1) {
        window.location.hash = "right"; 
    } else if (urllocation.indexOf("#bottom") > -1) {
        window.location.hash = "bottom";
    } else if(urllocation.indexOf("#left") > -1) {
        window.location.hash = "left";
    } else {
        window.location.hash = "middle";
    }
}

I am also guessing that your ‘wild card’ approach is meant to use regular expressions:

function goToAnchor() {
    var urllocation = location.href;
    var hashMatch = urllocation.match(/#(.*)/)
    if (hashMatch){
        window.location.hash = hashMatch[1];
    } else {
        window.location.hash = "middle";
    }
}

Again, I don’t quite see what effect this code should have, since window.location.hash will probably have the same value before and after the assignment.