CODEWITHSUNDEEP
javascripthtml
Bamuel
Bamuel

Reputation: 75

Running Javascript via href

<ul>
    <a href="#Project">
        <li onclick="project()">Projects</li>
    </a>
</ul>

a tab appears and you can click on it, which runs a javascript function and also changes the url to www.demo.com#Project.

Is it possible when i give someone the link like www.demo.com#Project it loads the page and automatically runs function project()

EDIT SOLUTION

if(window.location.hash == "#Project") {
        setTimeout('project();', 1);
} 
else {
}

a timeout must be set so it loads the page first then execute function

Upvotes: 2

Views: 148

Answers (5)

Bart Jellema
Bart Jellema

Reputation: 11

I assume you want this to work on several different anchors, so you could do something like this:

<ul>
    <li onclick="project()">
        <a href="#Project">Projects</a>
    </li>
</ul>

<script>
    function project() {
        alert('Function project called')
    };

    var elements = document.querySelectorAll("a[href='" + window.location.hash + "']")
    if (elements.length > 0)
    {
        elements[0].click();
    };
</script>

This code will make sure any hash anchor gets clicked when you navigate to the url with that hash.

Upvotes: 1

user6690322
user6690322

Reputation:

Yes it is possible. You dont have to do <a href="#Project"> <li onclick="project()">Projects</li> </a> because it is a painful code. Try to do this:

  `<ul>
      <li>
          <a href="#" onclick="project()">Projects</a>
      </li>
  </ul>`

It basically run the function called project() when you click the Projects. Base on your code your just navigating an element that has an id of Project.


You can also use 

<ul>
      <li>
          <a href="www.demo.com/projects.html">Projects</a>
      </li>
  </ul>

Then in projects.html run your script:

<script>

function project(){
  alert("I am your function.");
}

project(); //Call the function

</script>

Upvotes: 0

Tim McIntire
Tim McIntire

Reputation: 83

A small example 

If (window.location.hash === '#Project')  {
  project() ;
}

Upvotes: 0

alifallahi
alifallahi

Reputation: 330

the link will be for example "www.test.com#myproject" 
and "function project" will be run automatically

 <!doctype html>
    <html lang="en">
    <head>
        <meta charset="utf-8">
    <script>
    function project()
    {
      alert("hello");
    }    
    </script>
    </head>
    <body>
    <div id="myproject">
        <img src="test.jpg" onload="project()">
      <a>  sample text</a>
        <p>123456789</p>
        <ul>
          <li>one</li>
          <li>two</li>
          <li>three</li>
        </ul>
    </div>
    </body>
    </html>

Upvotes: 0

hakany
hakany

Reputation: 7264

No, script won't run if your give someone the URL. To achive this you should check whether window.location.hash equals '#Project' on page load.

Hope this helps

Btw. what Praveen Kumar mentioned is changing your code as follow:

<ul>
    <li onclick="project()">
        <a href="#Project">Projects</a>
    </li>
</ul>

Upvotes: 5

Related Questions