Question

93

Append #hashtag to link in HTML on the fly

rated 0 times [ 95] [ 2] / answers: 1 / hits: 20946 / 14 Years ago, thu, october 7, 2010, 12:00:00

I have a nav, each link in the nav just appends a hashtag on the existing URL when clicked, for live filtering, etc. with the use of jQuery.

I want to append the SAME current hashtag to a series of links within a div further down the page.

For example, I've clicked work and my URL now looks like:

http://www.domain.com/page.html#work

I have a series of links in the page:

<div id=links>

<ul>

  <li><a href=http://www.domain.com/link1>Link1</a></li>

  <li><a href=http://www.domain.com/link2>Link2</a></li>

  <li><a href=http://www.domain.com/link3>Link3</a></li>

  <li><a href=http://www.domain.com/link4>Link4</a></li>

</ul>

</div>

These links within the div#links need to be updated on the fly to append #work on all the URL's so that when clicked the hashtag is appended.

Is this possible? Does this make sense?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

deanna

Add To Favorites

Follow

Total Points: 84

Total Questions: 86

Total Answers: 107

Location: Cyprus

Member since Wed, Dec 8, 2021

3 Years ago

deanna questions

1 CastError: Cast to ObjectId failed for value XXXXXXXXXX (type string) at path _id for model XXXX

Thu, Apr 21, 22, 00:00, 2 Years ago

1 Next.js behavior on back button pressed

Mon, Sep 6, 21, 00:00, 3 Years ago

1 React-Router + Typescript error while wrapping component with Router No overload matches this call

Sat, Feb 13, 21, 00:00, 3 Years ago

1 Use the webpack asset module with a custom output filename

Sun, Jan 17, 21, 00:00, 3 Years ago

1 React js random color

Sun, Nov 15, 20, 00:00, 4 Years ago

View All

answered 14 Years ago marquezb · Accepted Answer

You should attach a click event handler for links in #nav and change links in #links accordingly. [See it in action]

Javascript

$(#nav a).click(function() {

  $(#links a).each(function() {

    this.href = this.href.split(#)[0] + # + window.location.hash;

  });

});

HTML

<div id=nav>  

  <a href=#work>work</a> - 

  <a href=#school>school</a>

</div>