0

I'm using a script to use AJAX on my blogger (https://github.com/swook/jquery-ajaxify-plugin) so users can listen music via the music player without interruption while they're navigating through differents pages.

Everything works except the random button. I'd like to AJAX-ify the random button.

The problem is when I click on the link, the page reloads.

You can check the problem here: http://www.julienlussiez.com/p/test_20.html

Here's the script: 

<script>
<!--
/*
Random link button- By JavaScript Kit (http://javascriptkit.com)
Over 300+ free scripts!
This credit MUST stay intact for use
*/

//specify random links below. You can have as many as you want

var randomlinks=new Array()

randomlinks[0]="http://www.julienlussiez.com/2013/01/le-repos-du-fou_21.html"
randomlinks[1]="http://www.julienlussiez.com/2012/11/dissonance-3.html"
randomlinks[2]="http://www.julienlussiez.com/2012/10/renaitre.html"
randomlinks[3]="http://www.julienlussiez.com/2013/01/defaillance.html"
randomlinks[4]="http://www.julienlussiez.com/2012/08/fragile-2012.html"

function randomlink(){
window.location=randomlinks[Math.floor(Math.random()*randomlinks.length)]
}

//-->
</script>
<form>
<p><input type="button" name="B1" value="Aléatoire" onclick="randomlink(); return false;" /></p> </form>

Thanks! It would be very nice if you'd have some clues!

Julien
  • 25
  • 1
  • 8

1 Answers1

1

When you use window.location="http://www.google.com/", for instance, it will change the current web page being viewed to Google's homepage. You will need to either load your content in an iFrame or via AJAX to stop your page from reloading. You can also look into providing a popout player for your music and whenever your user switches pages, the music will continue to play.

According to Ajaxify's documentation, to load a page via AJAX, you need to call this function:

$.Ajaxify.loadURL('/path/to/page.html');

Try replacing the window.location code with the $.Ajaxify.loadURL('/path/to/page.html'); in your sample code and see if that makes a difference.

Something like this:

function randomlink(){
$.Ajaxify.loadURL(randomlinks[Math.floor(Math.random()*randomlinks.length)]);
}
Cameron Tinker
  • 9,634
  • 10
  • 46
  • 85
  • I use AJAX on my website. Everything works, I mean my music player keeps playing when I switch pages, except with this button. I don't know how to make a random button with AJAX for blogger. – Julien Mar 23 '13 at 01:52
  • I just updated my answer to include what should be changed in your random button code. – Cameron Tinker Mar 23 '13 at 01:54
  • Good to hear! What did you do? – Cameron Tinker Mar 23 '13 at 02:05
  • 1
    Just what you told me to do. Thanks! – Julien Mar 23 '13 at 02:07
  • Do you have any idea for adding automatically my links in this script? – Julien Mar 23 '13 at 02:25
  • Just add them to your array of links. Perhaps this could be dynamically generated if you get the list of links for your site and store them in an array. – Cameron Tinker Mar 23 '13 at 14:08
  • Yes, that's what I'd like to do now. I can add them manually, it works but It could be great if they could be dynamically generated. I'm a beginner and I really don't know how to do it. I tried different things but it doesn't work. – Julien Mar 23 '13 at 16:19
  • You should post another question regarding the auto-populate. StackOverflow prefers that we don't have an extended discussion in comments. – Cameron Tinker Mar 23 '13 at 21:03