• 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
JQuery help!

#1
[eluser]Aaron L.[/eluser]
Hello,

Might you be able to help with a little simple Javascript? I've been working on this for a couple of hours and have run into a wall:

I need a function that will stop this count-down timer (jQuery plugin) when someone clicks on a link:

Plugin info page:
http://plugins.jquery.com/project/jquery-countdown

Plugin code:
Code:
jQuery.fn.countdown = function(options) {
    /**
     * app init
    */
    if(!options) options = '()';
    if(jQuery(this).length == 0) return false;
    var obj = this;    

    /**
     * break out and execute callback (if any)
     */
    if(options.seconds < 0 || options.seconds == 'undefined')
    {
        if(options.callback) eval(options.callback);
        return null;
    }

    /**
     * recursive countdown
     */
    var countdown = window.setTimeout(
        function() {
            jQuery(obj).html(String(options.seconds));
            --options.seconds;
            jQuery(obj).countdown(options);
        }
        , 1000
    );
    
    /**
     * return null
     */
    return this;

}

Thanks a million if you can help!

Aaron

#2
[eluser]Aaron L.[/eluser]
Anyone have thoughts/ideas on this?

#3
[eluser]Jay Turley[/eluser]
My instinct is that since the plugin does not provide this sort of functionality, then you need to write it yourself.

The plugin is basically calling setTimeout() over and over with a period of one second.

A simple (cheesy) solution: create a variable, use jquery to set it when an anchor is clicked, and then modify the plugin to check that variable.

Given the html tidbit:

Code:
<a href="#" id="stopCountdown">Stop Countdown</a>

We create a global variable:
Code:
var countdown_okay = true;

The click handler for the anchor is like so:

Code:
$('#stopCountdown').click( function() {
    countdown_okay = false;
});

And then we modify the plugin to look like the following:

Code:
/**
     * recursive countdown
     */
    var countdown = window.setTimeout(
        function() {
            jQuery(obj).html(String(options.seconds));
            if (countdown_okay) {
                --options.seconds; // only decrement countdown if okay to do so
            }
            jQuery(obj).countdown(options);
        }
        , 1000
    );

The reason I did it as above is so that you can stop and start the countdown by modifying the click handler for the anchor:

Code:
$('#stopCountdown').click( function() {
    countdown_okay = !countdown_okay;
});

I did not test any of this code. YMMV. Best of luck, etc.

Oh, and it would be MUCH better to drop this functionality into the plugin, but I was lazy. I would redo the plugin with a private variablt to handle whether or not the countdown was allowed to continue. But I am lazy. Did I say that already?

#4
[eluser]Pascal Kriete[/eluser]
You could stop the javascript timeout.
Code:
if(countdown) {
      clearTimeout(countdown);
}


Digg   Delicious   Reddit   Facebook   Twitter   StumbleUpon  


  Theme © 2014 iAndrew  
Powered By MyBB, © 2002-2020 MyBB Group.