2

I am using javascript to dynamically load page content on my webpage.

I have a number of links, but they do not have href attributes. When the user clicks a link, they have a data-content attribute which is used as a key to load new content dynamically from a JSON file.

My links look something like this:

<a data-content="about">About</a>

This works perfectly well.

I know from a UX perspective, users may want to right click a link and load it into a new tab. This current way of doing things does not permit this behaviour.

One way around this would be to move the data-content attribute to the href attribute and add a # before. For example:

<a href="#about">About</a>

Right clicking on this link and loading in a new tab would open the URL

<a href="mysite.com/my-current-page#about">About</a>

I could then use javascript to look for # in the URL and use the string after it as a key to find the content to load on the page.

When I make this change though - javascript no longer loads my new content.

So what are some ways of dynamically loading content onto a page whilst preserving the functionality of 'open in new tab

Adam Scot
  • 1,371
  • 4
  • 21
  • 41
  • One of [these](https://stackoverflow.com/questions/27765666/passing-variable-through-javascript-from-one-html-page-to-another-page)? Otherwise, add to your question how you're loading the data and someone will probably have a fix for the anchor/id approach. – wazz Jun 12 '21 at 12:31

0 Answers0