2013-03-25 4 views
0

Я хотел код, когда посетитель нажимает submit, он покажет время обратного отсчета до перенаправления на указанный сайт.jquery countdowntimer on submit

ниже демо-

http://jsfiddle.net/VJT9d/17/

это HTML код:

<input id="hulk" class="submit" name="send_contact" type="submit" value="Send" /> 

<div style="display:hidden">Redirecting In <span id="countdown">5</span>.</div> 

и код JQuery:

var timer = 5, 
el = document.getElementById('countdown'); 

$('#hulk').click(function t_minus() { 
'use strict'; 
el.innerHTML = timer--; 
if (timer >= 0) { 
    setTimeout(function() { 
     t_minus(); 
    }, 1000); 
} else { 
    window.location.replace("/"); 
} 
}()); 

как сделать таймер обратного отсчета времени появляются только после нажатия отправить?

ответ

0

, чтобы сделать сообщение видимым только после щелчка, вам нужно 2 вещи: во-первых, правильно скрыть элемент с правильным стилем, во-вторых, не запускайте функцию t_minus в последней строке!

solution

var timer = 5,

el = document.getElementById('countdown'); 
$('#hulk').click(function t_minus() { 
'use strict'; 
el.innerHTML = timer--; 
if (timer >= 0) { 
    setTimeout(function() { 
    t_minus(); 
    }, 1000); 
} else { 
    window.location.replace("/"); 
} 
}); 

ознакомьтесь, пожалуйста, также как скрыть элементы с помощью CSS

2

Просто удалите () у вас есть в конце.

var timer = 5, 
    el = document.getElementById('countdown'); 

$('#hulk').on('click', function t_minus() { 
    'use strict'; 
    el.innerHTML = timer--; 
    if (timer >= 0) { 
     setTimeout(function() { 
      t_minus(); 
     }, 1000); 
    } else { 
     window.location.replace("/"); 
    } 
}); 

обновленный fiddle.

0

Использование

$ ('# обратный отсчет'). Шоу()

внутри функции мыши.