Welcome to WebmasterWorld Guest from 54.205.251.179

Forum Moderators: open

Message Too Old, No Replies

random choice from array of functions

   
9:36 am on Mar 21, 2011 (gmt 0)

5+ Year Member



Hi,

Not sure how to randomly call one function from an array of three functions: I've tested the functions individually, they're jQuery AJAX calls, and they'r ok. This is what I've got:

function page1() {
$('#readout').load('readouts/page1.htm')}

function page2() {
$('#readout').load('readouts/page2.htm')}

function page3() {
$('#readout').load('readouts/page3.htm')}

incomplete function:

function doPage() {
var pages = new Array("page1()","page2()","page3()");
// how to activate? // Math.floor(Math.random()*pages.length)
}

cheers
12:42 pm on Mar 21, 2011 (gmt 0)

WebmasterWorld Senior Member fotiman is a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month



Try this:

function doPage() {
var pages = [page1, page2, page3],
randomnumber = Math.floor(Math.random() * pages.length);
pages[randomnumber]();
}

In that example, the pages array contains references to functions page1, page2, and page3. So doing:

pages[randomenumber]

is referring to one of those function references, and the () at the end will cause the function to execute.

Side note, avoid using "new Array()". Instead, just use the square bracket notation to create the array. This avoids the overhead of calling "new" and is slightly more compact. :)
6:35 pm on Mar 21, 2011 (gmt 0)

5+ Year Member



Many thanks ! for explanation and comments as well as solution.
8:05 pm on Mar 21, 2011 (gmt 0)

5+ Year Member



One small problem still.

I'm testing by clicking on a link:
<a href="#" onclick="doPage();")>readout test</a>.

So far, the link *never* works on the first click.
Second time, it sometimes shows an incomplete display, but mostly works correctly.
Third time, it always works.

It doesn't seem to be a loading problem. I've tried loading the script first (it's an AJAX load), and doing a setTimeout on loading the content it acts on; also tried incorporating the script into my main script file, not AJAXing it.

I don't fully understand 'initialisation', but could that be the problem?

cheers
11:20 pm on Mar 21, 2011 (gmt 0)

WebmasterWorld Senior Member fotiman is a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month



I suspect the problem lies elsewhere, and not with the bit of code relating to the random function call. Here's a quick test case:

<!DOCTYPE html>
<html>
<head>
<title>Test</title>
</head>
<body>
<a href="#" onclick="doPage();")>readout test</a>.
<script>
function page1() {
alert('page1');
}
function page2() {
alert('page2');
}
function page3() {
alert('page3');
}
function doPage() {
var pages = [page1, page2, page3],
randomnumber = Math.floor(Math.random() * pages.length);
pages[randomnumber]();
}
</script>
</body>
</html>


That should at least demonstrate that this part is functioning.
1:13 am on Mar 22, 2011 (gmt 0)

WebmasterWorld Senior Member 5+ Year Member



<a href="#" onclick="doPage();return false;")>readout test</a>.

this will prevent browser trying to goto both PageN AND '#', may help, won't harm.
1:49 am on Mar 22, 2011 (gmt 0)

WebmasterWorld Senior Member fotiman is a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month



Yeah, I almost specified the return false bit as well, but since the href was "#" I left it out. :)
6:31 am on Mar 22, 2011 (gmt 0)

5+ Year Member



I'd already tried "return false", hadn't mentioned it; also "javascript:/**/": no diff.

The test works fine first pop.

So the trouble may be because the functions each load three small text elements by AJAX ( with varying orders and setTimeouts) and after a short interval, removes them, by loading an empty version of the three elements.

I have tried waiting about ten seconds before clicking the link first time, but it doesn't make a difference either.

I'll try making these all part of the main page, and change the functions to use 'display'.

(I'm not up to speed on Firebug: just Firefox in private browsing mode, checking the error console).

Will report back....

Then, we may have to look at the actual code : )

cheers
10:52 am on Mar 22, 2011 (gmt 0)

5+ Year Member



OK: the problem is definitely to do with AJAX/loading.

I've reworked the code so that all options are loaded as part of the main page, and made 'display:none'; and reworked the functions 'page1()' etc so that they do 'display:inline" on the appropriate options.

And that works, on the first click. I can live with that.

Question is, is anyone interested in exploring further what the AJAX version needs to make it fire? If so, I can post or send links.

cheers
12:59 pm on Mar 22, 2011 (gmt 0)

WebmasterWorld Senior Member fotiman is a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month



Sure, post up the code and we'll take a look. You might want to post it in a new thread, though.
4:14 pm on Mar 22, 2011 (gmt 0)

5+ Year Member



No need: it was actually a d'oh problem.

I hadn't noticed that, in the process of testing, in the html I'd commented out the target <spans> into which the texts are loaded.

So the code ran, found nowhere to load, but ran the last part of the function, which reloads the target <spans>... ready for the second click.