-1
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="jquery.countdown.js"></script>
<script type="text/javascript">
$(function() {
    $('#shortly').countdown({until: 12, 
    onExpiry: liftOff, onTick: watchCountdown});
});

$('#shortlyStart').click(function() {
    shortly = new Date();
    shortly.setSeconds(shortly.getSeconds() + 12.5);
    $('#shortly').countdown('change', {until: shortly});
});

function liftOff() {
    alert('We have lift off!');
}

function watchCountdown(periods) {
    $('#monitor').text('Just ' + periods[5] + ' minutes and ' +
        periods[6] + ' seconds to go');
}
</script>

<span id="shortly"></span>
<button name="newPageStart" id="shortlyStart" type="button">Start</button>
<span id="monitor"></span>
5
  • 1
    Seems to be working according to the specifications. Commented Feb 21, 2011 at 5:23
  • when i click the start button the timer couldn't be restart.,i mean again it should goes to 00:00:12.,(It's not working for me when i click the button) Commented Feb 21, 2011 at 5:28
  • 3
    @john2103 - Your question has zero letters that describe what should happen, and what actually happen. You can't just paste the code and expect people to know what's the problem (though I've guessed). Try editing the question and its title and give some more details. Commented Feb 21, 2011 at 5:30
  • My Problem is when i'm click the start button the timer will not go to 00:00:12.,it's a bidding process...my timer is decreasing when the actual time 00:00:12 to 00:00:00..,when the user enter in to the bidding process they hit the bid button (i,e)start button.,when decreasing the time.,for exampl.,you are enter into my website hit the bid button (i.e) start button when the timer running with the time of 00:00:08.,after that it should goes to 00:00:12 not a 00:00:07... Commented Feb 21, 2011 at 5:39
  • This question is similar to: Why does jQuery or a DOM method such as getElementById not find the element?. If you believe it’s different, please edit the question, make it clear how it’s different and/or how the answers on that question are not helpful for your problem. Commented Oct 12, 2024 at 10:56

1 Answer 1

2

The $('#shortlyStart').click event should be bound in the $(document).ready event:

$(function() {
    $('#shortly').countdown({until: 12, 
    onExpiry: liftOff, onTick: watchCountdown});

    $('#shortlyStart').click(function() {
        shortly = new Date();
        shortly.setSeconds(shortly.getSeconds() + 12.5);
        $('#shortly').countdown('change', {until: shortly});
    });
});

The line $('#shortlyStart') is looking for the <button> with id=shortlyStart. However, when that line of code runs, the button isn't likely to have been created yet, and the click event isn't bound to any element. Place it in the $(document).ready event (which is the same as the first line: $(function() {}), it's a shortcut), and the line would run after the whole document was loaded.

See also: $(document).ready

Sign up to request clarification or add additional context in comments.

1 Comment

Reference link., keith-wood.name/countdown.html Click the callbacks menu., I want the exact functionality of the first example of this site... "Action it in 5 seconds:"

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.