4

I have some code that'll allow me to open up a random website from a list of websites but I'd like to open each one up in a new tab, how do I do this?

Information you may need

the code

    <html>
    <button onclick="randomLink();OpenInNewTab();">Click here to go somewhere else!    </button>

    <script type="text/javascript">


    var randomLink = function () {

        // first create an array of links
        var links = [
            "bbc.com",
            "google.com",
            "youtube.com",
        "facebook.com"
        ];

        // then work out the maximum random number size
        // by counting the number of links in the array
        var max = (links.length)

        // now generate a random number
        var randomNumber = Math.floor(Math.random()*max);

        // use that random number to retrieve a link from the array
        var link = links[randomNumber];

        // change the location of the window object
        window.location = "http://" + link;

        // Opens a new tab.
        function OpenInNewTab(url) {
        var win = window.open(url, '_blank');
         win.focus();
}
    }
    </script>
</html>

I tried doing the action in question at two different points and hope you're input can help to correct this.

Location 1

<button onclick="randomLink();OpenInNewTab();">Click here to go somewhere else!

Location 2

// Opens a new tab.
function OpenInNewTab(url) {
var win = window.open(url, '_blank');
win.focus();

The following web address is what the code currently looks like and does.

*EDIT : The only changes I made are the websites.They're much more on the live demo.

Konstantin V. Salikhov
  • 4,554
  • 2
  • 35
  • 48
flyinggoatman
  • 43
  • 1
  • 3

2 Answers2

2

The code you wrote is wrong, since you change the address of the current window (via the line window.location=..., and other issues... but here:

Working example fiddle

Very similar, and works.

Code

HTML

<button onclick="openStuff();">Click here to go somewhere else!</button>

JS

// the used links
var links = [
    "bbc.com",
    "google.com",
    "youtube.com",
    "facebook.com"];

openStuff = function () {
    // get a random number between 0 and the number of links
    var randIdx = Math.random() * links.length;
    // round it, so it can be used as array index
    randIdx = parseInt(randIdx, 10);
    // construct the link to be opened
    var link = 'http://' + links[randIdx];
    // open it in a new window / tab (depends on browser setting)
    window.open(link);
};
Community
  • 1
  • 1
Matyas
  • 13,473
  • 3
  • 60
  • 73
0

Based on Matyas' answer, I updated the example to work in strict mode. Working Example on Codepen.

Code

HTML

<button id="open-link">Click here to go somewhere else!</button>

JS

"use strict";

// the used links
const links = ["bbc.com", "google.com", "youtube.com", "facebook.com"];

const openLink = function (links) {
  // get a random number between 0 and the number of links
  // and round it, so it can be used as array index
  const randIdx = parseInt(Math.random() * links.length, 10);
  // construct the link to be opened
  const link = "https://" + links[randIdx];
  // open it in a new window or tab (depends on browser setting)
  window.open(link);
};

window.onload = function () {
  document.getElementById("open-link").onclick = () => openLink(links);
};
Kaleidosium
  • 31
  • 2
  • 9