can anchor in URL trigger javascript?

Posted on 2006-05-18
Last Modified: 2008-01-16
Thanks in advance on this.

Is there a way to make an anchor call in Url trigger javascript?

So you click a link to:

And the following file alerts "hey":

<h2>Chapter 1</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 2</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 3</h2>
<p>This chapter explains ba bla bla</p>

<h2 ><a name="C4" onload="alert('hey')">Chapter 4</a></h2>
<p>This chapter explains ba bla bla</p>


Question by:mtnr
    LVL 49

    Expert Comment



    Author Comment

    it didn't say "hey" for me.  did it work for you?

    the thing is, I want it to happen when the page loads, *not* when the user clicks on link.

    thank you.
    LVL 19

    Expert Comment

    Not gonna happen using standard anchors mtnr. You can give an onload event to a page, but it won't change depending on an anchor.

    LVL 15

    Accepted Solution

    I would suggest using the onload event to check the document.location object to see if it refers to the anchor like this:

    <body onload="if (document.location.href.indexOf('#C4') != -1) { alert('hey'); }">
    LVL 3

    Expert Comment

    I would have to agree with mshogren
    LVL 4

    Expert Comment

    yes... excellent answer

    Author Comment

    very nice, this works in IE and FF.  thank you mshogen!

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    IT, Stop Being Called Into Every Meeting

    Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

    "I want to put my photos online, but I don't want them stolen.  What settings should I use?" When You Put Photos Online First and foremost, any digital file published on the WWW can be copied, stored, modified, retransmitted, etc.  Remember Naps…
    This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
    In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
    The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.

    779 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    13 Experts available now in Live!

    Get 1:1 Help Now