Opening external links in the same new tab

Question

How to open external links in the same new tab in the same browser window ?

( i.e. first click in an external link triggers a new tab, but subsequent clicks on the external links open up in that same tab without creating additional tabs in the browser window )

Example : See how LegWorkStudio doing it in their portfolio in between the following links

possible duplicate of [Open link in new tab](http://stackoverflow.com/questions/15551779/open-link-in-new-tab) — Patel, Jul 15 '15 at 07:59
I think the question might be to continuously open links in one single new tab. I.e., first link click triggers a new tab, but subsequent link clicks open up in that same tab without creating additional tabs? — Ted Nyberg, Jul 15 '15 at 08:01
I took a look at the construction of the legworkstudio website and the don't load external links. All content you see when clicking on the links exists on the website as hidden div's. They only load a hidden div into another to display it. This can easily be done with a library like jQuery. — Soldierflup, Jul 15 '15 at 08:08

Soldierflup · Answer 1 · 2015-07-15T11:23:08.220

-1

HTML :

<div id="target" />
<div id="source"><p>bla bla bla</p></div>

Content replacement via normal javascript :

document.getElementById("target").innerHTML = document.getElementById("source").innerHTML;

Content replament via jQuery :

$("#target").html($("#source").html());

You can bind this code to a link by adding the onclick method to the link and wrapping it in a function (normal JS) or via the different methods of jQuery (on, click).

Example JS:

<a id="copytext" href="#" onclick='copyText();return false'>Copy text</a>
<script>
    function copyText() {
        document.getElementById("target").innerHTML = document.getElementById("source").innerHTML;
    }
</script>

Example jQuery :

<script>
$(function() {
    $("#copyref").click(function(e) {
        e.preventDefault();
        $("#target").html($("#source").html());
    });
})
</script>

edited Jul 15 '15 at 11:23

answered Jul 15 '15 at 11:12

Soldierflup

114
1
9

I'm only asking for any code that demonstrating opening the external links on the same new tab, not how LegWorkStudio changing the display of the content from none to block. – Biraj Bora Jul 15 '15 at 12:23
checkout the documentation for the jQuery load method [https://api.jquery.com/load/] – Soldierflup Jul 16 '15 at 13:18
I think you haven't understood the question . Please go through it again !! – Biraj Bora Jul 17 '15 at 05:48
As I allready stated before, all content exists on the page when it is loaded the first time. The only thing they do is show/hide the different content when you click on a link. The formatiing of the links is for having good SEO results. If you don't want to understand this, I can't help you any further. – Soldierflup Jul 20 '15 at 06:10

score -2 · Answer 2 · answered Jul 15 '15 at 08:07

It seems they just change window.location variable onclick then operates some JS code to display the right section.

At load, they surely read the window.location last argument and display the right section.

You can make something like that :

var myButton = document.getElementById("sectionXXXButton");
myButton.onclick = function(){
    var a = window.location.split("/");
    a[a.length-1] = "XXX";
    window.location = a.join("/");
    // Some code to undisplay / display appropriate sections
}

Opening external links in the same new tab

2 Answers2