Follow link, then execute a function

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • Spartanicus

    Follow link, then execute a function

    I need to execute a function after a link to a section within the same
    document has been clicked and the navigation has occurred. When using
    the onclick event handler the JS function is executed before the
    navigation occurs. I can't tie it to a window.onload event since the
    link only navigates within the already loaded document.

    I'm not having any luck searching due to not knowing what keywords to
    use. I looked at an explanation of bubbling vs capturing, but that
    doesn't appear to be what I need.

    --
    Spartanicus
  • Daz

    #2
    Re: Follow link, then execute a function


    Spartanicus wrote:
    I need to execute a function after a link to a section within the same
    document has been clicked and the navigation has occurred. When using
    the onclick event handler the JS function is executed before the
    navigation occurs. I can't tie it to a window.onload event since the
    link only navigates within the already loaded document.
    >
    I'm not having any luck searching due to not knowing what keywords to
    use. I looked at an explanation of bubbling vs capturing, but that
    doesn't appear to be what I need.
    >
    --
    Spartanicus
    Enclose the function to be called within a function statement. For
    example:

    objectName.oncl ick = function(){ functionToBeCal led(); }

    Comment

    • shimmyshack

      #3
      Re: Follow link, then execute a function

      so you mean moving to a named section using hash?

      <a
      name="1"
      href="#2"

      onclick="javasc ript:document.l ocation='#2';al ert('youve_reac hed_2');"
      >
      asdas
      </a>

      ..
      ..
      ..
      ..
      <a
      id="2"
      name="2"
      href="#1"

      onclick="javasc ript:document.l ocation='#1';do cument.getEleme ntById('1').onf ocus
      = function(){aler t('youve_reache d_1')};"
      >
      asdas
      </a>

      the first onclick uses two js statements so you can be sure the first
      executes before the second.
      the second onclick does the same but uses onfocus which might be more
      predictable.

      dont use onclick though right, and this is a dirty solution!

      Comment

      • VK

        #4
        Re: Follow link, then execute a function


        Spartanicus wrote:
        I need to execute a function after a link to a section within the same
        document has been clicked and the navigation has occurred. When using
        the onclick event handler the JS function is executed before the
        navigation occurs.
        Yes, this behavior is by design. As already suggested you can move the
        navigation part to the script as well, just don't use the whole href
        replacement on hash or IE before 6 may get dizzy or nasty of that :-)

        Your links then could be like:

        <a href="#anchor00 1" onclick="self.l ocation.hash='a nchor001';
        myFunction(); return false">Anchor 001</a>

        This way with script enabled "return false" will prevent the default
        navigation but will execute the programmed one.

        With script disabled you'll get just a regular anchor.

        Comment

        Working...