homepage Welcome to WebmasterWorld Guest from 54.205.98.35
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

    
random choice from array of functions
ctoz




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

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

 

Fotiman




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

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. :)

ctoz




msg:4285214
 6:35 pm on Mar 21, 2011 (gmt 0)

Many thanks ! for explanation and comments as well as solution.

ctoz




msg:4285259
 8:05 pm on Mar 21, 2011 (gmt 0)

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

Fotiman




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

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.

daveVk




msg:4285412
 1:13 am on Mar 22, 2011 (gmt 0)

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

this will prevent browser trying to goto both PageN AND '#', may help, won't harm.

Fotiman




msg:4285428
 1:49 am on Mar 22, 2011 (gmt 0)

Yeah, I almost specified the return false bit as well, but since the href was "#" I left it out. :)

ctoz




msg:4285516
 6:31 am on Mar 22, 2011 (gmt 0)

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

ctoz




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

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

Fotiman




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

Sure, post up the code and we'll take a look. You might want to post it in a new thread, though.

ctoz




msg:4285772
 4:14 pm on Mar 22, 2011 (gmt 0)

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.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved