Made a javascript program that accesses a random url but a problem! Help!

Page 2 - Seeking answers? Join the AnandTech community: where nearly half-a-million members share solutions and discuss the latest tech.

Leros

Lifer
Jul 11, 2004
21,867
7
81
Each html document has a head section. Usually <head> </head>. The script tags with JavaScript go in there. On my phone on tapa I don't see any code..weird.

JavaScript doesn't have to go in the head section.
 

sze5003

Lifer
Aug 18, 2012
14,304
675
126
JavaScript doesn't have to go in the head section.

Yeah that's correct but it's good practice to set up like that until you are more comfortable putting it anywhere else be it in the body or separate file and linking it.
 

sze5003

Lifer
Aug 18, 2012
14,304
675
126
Fixed for you:

<!DOCTYPE html>

<html>

<head>
<center><title>Choose a topic for a random site about that topic</title>
</head>

<body>
<center><h1>Tech</h1>
<script>




function randomlink(){

var randomlinks=new Array()

randomlinks[0]="http://anandtech.com"
randomlinks[1]="http://xbitlabs.com"
window.location=randomlinks[Math.floor(Math.random()*randomlinks.length)]
}
//-->
</script>
<form>
<p><input type="button" name="B1" value="Random Link" onclick="randomlink()"></p> </form>

<!--Uncomment below to use a regular text link instead
<a href="javascript:randomlink()">Random Link</a>
-->





<center><h2>Automotive</h2>
<script>





function randomlinkAuto(){
var randomlinkAuto=new Array()


randomlinkAuto[0]="http://chevrolet.com"
randomlinkAuto[1]="http://chrystler.com"

window.location=randomlinkAuto[Math.floor(Math.random()*randomlinkAuto.length)]
}
//-->
</script>
<form>
<p><input type="button" name="B2" value="Random Link" onclick="randomlinkAuto()"></p> </form>

<!--Uncomment below to use a regular text link instead
<a href="javascript:randomlink()">Random Link</a>
-->





<center><h2>Home</h2>
<script>

function randomlinkHome(){
var randomlinkHome=new Array()

randomlinkHome[0]="http://lowes.com"
randomlinkHome[1]="http://homedepot.com"
randomlinkHome[2]="http://walmart.com"

window.location=randomlinkHome[Math.floor(Math.random()*randomlinkHome.length)]
}
//-->
</script>
<form>
<p><input type="button" name="B3" value="Random Link" onclick="randomlinkHome()"></p> </form>

<!--Uncomment below to use a regular text link instead
<a href="javascript:randomlink()">Random Link</a>
-->

</body>

</html>
 

sze5003

Lifer
Aug 18, 2012
14,304
675
126
You were making the variables and arrays outside the functions I think it was messing it up when calling the other random link sections.
 

Cpus

Senior member
Apr 20, 2012
345
0
0
thanks. Can't seem to figure how to get it to open in a new tab but its fime.
 

Leros

Lifer
Jul 11, 2004
21,867
7
81
thanks. Can't seem to figure how to get it to open in a new tab but its fime.

This seems like it might work:
http://stackoverflow.com/a/11384018

Edit: apparently this does not work. It get blocked by pop-up blockers which actually makes a lot sense. You can open links in new tabs by setting target="_blank". Not sure if this works, but can you let the anchor actually execute and just change the href value via JavaScript?
 
Last edited:

sze5003

Lifer
Aug 18, 2012
14,304
675
126
This seems like it might work:
http://stackoverflow.com/a/11384018

Edit: apparently this does not work. It get blocked by pop-up blockers which actually makes a lot sense. You can open links in new tabs by setting target="_blank". Not sure if this works, but can you let the anchor actually execute and just change the href value via JavaScript?

Yup, Where you have the a href tags for each section, add target=_blank that will open it up in a new tab.
 

Cpus

Senior member
Apr 20, 2012
345
0
0
<!DOCTYPE html>

<html>

<head>
<center><title>Choose a topic for a random site about that topic</title>
</head>

<body>
<center><h1>Tech</h1>
<script>


function randomlink(){

var randomlinks=new Array()


randomlinks[0]="http://anandtech.com"
randomlinks[1]="http://xbitlabs.com"


window.location=randomlinks[Math.floor(Math.random()*randomlinks.length)]
}
//-->

</script>

<form>

<p><input type="button" name="B1" value="Random Link" onclick="randomlink()"></p> </form>

<!--Uncomment below to use a regular text link instead
<a href="javascript:randomlink();" target="_blank">Random Link</a>
-->




<center><h2>Automotive</h2>
<script>





function randomlinkAuto(){
var randomlinkAuto=new Array()


randomlinkAuto[0]="http://chevrolet.com"
randomlinkAuto[1]="http://chrysler.com"

window.location=randomlinkAuto[Math.floor(Math.random()*randomlinkAuto.length)]
}
//-->
</script>
<form>
<p><input type="button" name="B2" value="Random Link" onclick="randomlinkAuto()"></p> </form>

<!--Uncomment below to use a regular text link instead
<a href="javascript:randomlink();" target="_blank">Random Link</a>
-->





<center><h2>Home</h2>
<script>

function randomlinkHome(){
var randomlinkHome=new Array()

randomlinkHome[0]="http://lowes.com"
randomlinkHome[1]="http://homedepot.com"
randomlinkHome[2]="http://walmart.com"

window.location=randomlinkHome[Math.floor(Math.random()*randomlinkHome.length)]
}
//-->
</script>
<form>
<p><input type="button" name="B3" value="Random Link" onclick="randomlinkHome()"></p> </form>

<!--Uncomment below to use a regular text link instead
<a href="javascript:randomlink();" target="_blank">Random Link</a>
-->

</body>

</html>
 

Dratickon

Junior Member
May 13, 2012
21
0
0
Well, the problem is that you're trying to mix two ways of doing something and I don't think you understand what's going on. Rather than just cutting and pasting stuff, try walking through it logically.

This section is never going to work because it's commented out:
Code:
<!--Uncomment below to use a regular text link instead
<a href="javascript:randomlink();" target="_blank">Random Link</a>
-->

Secondly, inside the "randomlink" function there's this line that is changing the url/location of your current window (hence why it's not opening in a new tab):
Code:
window.location=randomlinks[Math.floor(Math.random()*randomlinks.length)]

Here's a different way of doing it. Not my preferred way, but hopefully it's straightforward enough that you can understand what's going on:
Code:
<script>
function randomlink(elem){
[indent]var randomlinks=new Array()
randomlinks[0]="http://anandtech.com"
randomlinks[1]="http://xbitlabs.com"
elem.href = randomlinks[Math.floor(Math.random()*randomlinks.length)];
return false;[/indent]
}
</script>
<a href="#" onclick="randomlink(this);" target="_blank">Random Link</a>

When you click the anchor tag it runs your randomlink function and sets the href of that anchor to your random link. Since you have the target="_blank" in there, it will open in a new tab. The link will be randomly generated every time you click on it. Does that make sense?
 
Last edited:

Leros

Lifer
Jul 11, 2004
21,867
7
81
Dratickon's solution is pretty decent.

Here's my take on it:

Code:
<html>
<head>
    <script type="text/javascript">
        //random links for example purpose
        var randomlinks = [
            "http://anandtech.com", 
            "http://xbitlabs.com",
            "http://google.com",
            "http://yahoo.com"
        ];

        function setRandomLink() {        
            var anchor = document.getElementById("randomlink");
            anchor.href = randomlinks[Math.floor(Math.random()*randomlinks.length)];
            return true;
        }
    </script>
</head>
<body>
    <a id="randomlink" href="#" target="_blank" onclick="setRandomLink();">Random Link</a>
</body>
</html>

Edit: there is a downside to this solution. Say I click the link once and it takes me to google.com. Now the href is set to google.com. If I hover over the link, it will say google.com, but clicking the link again will take me to another random URL. You could of course modify what I wrote to only set the href once, so that the link always goes to the same random URL.
 
Last edited: