Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 30.04.2014, 18:50
Интересующийся
Отправить личное сообщение для Norm Iridium Посмотреть профиль Найти все сообщения от Norm Iridium
 
Регистрация: 16.05.2010
Сообщений: 19

До конца события осталось (Jquery)
Написал на днях, может кому пригодится.
Сервер отдает время конца акции:
<b data-time="1398880830"></b><br/>
<b data-time="1398870821"></b>

Уменьшение счетчика:
<script>
String.prototype.plural = Number.prototype.plural = function(a, b, c) {
	var index = this % 100;
	index = (index >=11 && index <= 14) ? 0 : (index %= 10) < 5 ? (index > 2 ? 2 : index): 0;
	return(this+[a, b, c][index]);
}
function downtimers(){
	$('[data-time]').each(function(){
		var s = parseInt($(this).data('time'))-parseInt(new Date().getTime()/1000);
		if(s<0) 
			$(this).text('акция закончилась');
		else{
			s-=(d=Math.floor(s/60/60/24))*24*60*60;
			s-=(h=Math.floor(s/60/60))*60*60;
			s-=(m=Math.floor(s/60))*60;			
			$(this).text(
				(d<10?'0'+d:d).plural(" дней "," день "," дня ")+
				(h<10?'0'+h:h).plural(" часов "," час "," часа ")+
				(m<10?'0'+m:m).plural(" минут "," минута "," минуты ")+
				(s<10?'0'+s:s).plural(" секунд "," секунда "," секунды ")
			);
		}
	});
}
downtimers();
setInterval(downtimers,1000);
</script>

Последний раз редактировалось Norm Iridium, 30.04.2014 в 18:52.
Ответить с цитированием
  #2 (permalink)  
Старый 30.04.2014, 23:16
Аватар для BETEPAH
Профессор
Отправить личное сообщение для BETEPAH Посмотреть профиль Найти все сообщения от BETEPAH
 
Регистрация: 23.06.2011
Сообщений: 1,165

я бы предложил заменить 9ю строку на:
var arr = $(this).data('time').split(/[^0-9]/);
var s = Math.floor(((new Date (arr[0], arr[1]-1, arr[2])).getTime() - (new Date().getTime())) / 1000);

и дату события указывать в удобном для человека формате:
<b data-time="2014-08-23"></b>
Ответить с цитированием
  #3 (permalink)  
Старый 01.05.2014, 00:17
Интересующийся
Отправить личное сообщение для Norm Iridium Посмотреть профиль Найти все сообщения от Norm Iridium
 
Регистрация: 16.05.2010
Сообщений: 19

BETEPAH,
ещё неплохо вынести $('[data-time]') из таймера определив переменной выше, накладные затраты на поиск каждый раз исчезнут. Дату сделал с вариантом. За Math.floor спасибо, так лучше.

<b data-time="2014-05-01 0:55:00"></b><br>
<b data-time="2014-05-01"></b>

<script>
String.prototype.plural = Number.prototype.plural = function(a, b, c) {
	var index = this % 100;
	index = (index >=11 && index <= 14) ? 0 : (index %= 10) < 5 ? (index > 2 ? 2 : index): 0;
	return(this+[a, b, c][index]);
}
$datatime=$('[data-time]');
function downtimers(){
	$datatime.each(function(){
		var d,h,m;
		var t = $(this).data('time').split(/[^0-9]/);
		var s = Math.floor(((new Date (t[0], t[1]-1, t[2], t[3]?t[3]:0, t[4]?t[4]:0, t[5]?t[5]:0)).getTime() - (new Date().getTime())) / 1000);
		if(s<0) 
			$(this).text('акция закончилась');
		else{
			s-=(d=Math.floor(s/60/60/24))*24*60*60;
			s-=(h=Math.floor(s/60/60))*60*60;
			s-=(m=Math.floor(s/60))*60;			
			$(this).text(
				(d<10?'0'+d:d).plural(" дней "," день "," дня ")+
				(h<10?'0'+h:h).plural(" часов "," час "," часа ")+
				(m<10?'0'+m:m).plural(" минут "," минута "," минуты ")+
				(s<10?'0'+s:s).plural(" секунд "," секунда "," секунды ")
			);
		}
	});
}
downtimers();
setInterval(downtimers,1000);
</script>

Последний раз редактировалось Norm Iridium, 01.05.2014 в 01:07.
Ответить с цитированием
  #4 (permalink)  
Старый 01.05.2014, 01:07
Аватар для BETEPAH
Профессор
Отправить личное сообщение для BETEPAH Посмотреть профиль Найти все сообщения от BETEPAH
 
Регистрация: 23.06.2011
Сообщений: 1,165

Сообщение от Norm Iridium
ещё неплохо вынести $('[data-time]') из таймера определив переменной выше
Ну, я особо в Ваш код не вмешивался, но раз стал вопрос, я скорее сделал бы этот таймер jQuery.fn-плагином и дату задавал бы в опциях к нему.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
jquery события on и live Esigns Общие вопросы Javascript 4 12.08.2013 15:30
Цепная обработка события MouseDown с использованием jQuery gifer Events/DOM/Window 0 18.02.2011 16:55
jQuery object в xpath. Глобальные события solarix jQuery 1 29.10.2010 16:40
События Jquery и не только Tohin Events/DOM/Window 3 21.08.2009 14:57
Обработчик события: как делает jquery? Shasoft jQuery 35 22.04.2009 09:41