Как получить текущее время и сравнить с тем что у меня в ul?
Выводиться на сайте список программ, как подчеркнуть текущую программу, которая идет в эфире?
<ul class="tvprog">
<li>
<span class="canals-time">07:00</span> <span class="canals-program">Օրախնդիր</span>
</li>
<li>
<span class="canals-time">07:40</span> <span class="canals-program">Ուղիղ խոսք</span>
</li>
<li>
<span class="canals-time">08:00</span> <span class="canals-program">Հարցազրույց</span>
</li>
<li>
<span class="canals-time">08:30</span> <span class="canals-program">Ռեպորտաժներ</span>
</li>
<li>
<span class="canals-time">09:00</span> <span class="canals-program">Pressnig ՍԱԹԻԿ ՍԵՅՐԱՆՅԱՆԻ ՀԵՏ</span>
</li>
<li>
<span class="canals-time">09:40</span> <span class="canals-program">Լուրեր Ոստիկանությունից</span>
</li>
<li>
<span class="canals-time">09:50</span> <span class="canals-program">Լուրեր (Մարզերից)</span>
</li>
</ul>
Ответы (1 шт):
Автор решения: CbIPoK2513
→ Ссылка
Вот такой вариант
let time = [], // Создаём массив
cur_time = new Date(); // Получаем текущее время
cur_time = (cur_time.getHours()*3.6e+6) + (cur_time.getMinutes()*60000); // Переводим часы и минуты в миллисекунды
$('.tvprog > li').each(function(){ // Проходим по всем елементам с временем
let t = $(this).find('.canals-time').text().split(':'); // Получаем время
t[0] = Number(t[0]); // Переводим в число
t[1] = Number(t[1]); // Переводим в число
t = (t[0]*3.6e+6) + (t[1]*60000); // Переводим в миллисекунды
time.push(t); // Добавляем в массив
});
let time_index; // Создаём переменную
for(let i = 0; i < time.length; i++) { // Проходим циклом по массиву
if(cur_time > time[i] && cur_time < (time[i+1] ? time[i+1] : 8.64e+7)) { // Если текущее время больше указанного и меньше следующего в массиве, то..
time_index = i; // .. в переменную назначаем индекс массива
break; // Останавливаем массив
}
}
$('.tvprog > li').eq(time_index).css('color', 'green'); // Находим элемент по массиву.
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="tvprog">
<li>
<span class="canals-time">07:00</span>
<span class="canals-program">Օրախնդիր</span>
</li>
<li>
<span class="canals-time">07:40</span>
<span class="canals-program">Ուղիղ խոսք</span>
</li>
<li>
<span class="canals-time">08:00</span>
<span class="canals-program">Հարցազրույց</span>
</li>
<li>
<span class="canals-time">08:30</span>
<span class="canals-program">Ռեպորտաժներ</span>
</li>
<li>
<span class="canals-time">09:00</span>
<span class="canals-program">Pressnig ՍԱԹԻԿ ՍԵՅՐԱՆՅԱՆԻ ՀԵՏ</span>
</li>
<li>
<span class="canals-time">09:40</span>
<span class="canals-program">Լուրեր Ոստիկանությունից</span>
</li>
<li>
<span class="canals-time">09:50</span>
<span class="canals-program">Լուրեր (Մարզերից)</span>
</li>
</ul>
Вариант с автообновлением
let time = [];
$('.tvprog > li').each(function(){
let t = $(this).find('.canals-time').text().split(':');
t[0] = Number(t[0]);
t[1] = Number(t[1]);
t = (t[0]*3.6e+6) + (t[1]*60000);
time.push(t);
});
function Update(method) {
let t = new Date(), index,
ct = (t.getHours()*3.6e+6) + (t.getMinutes()*60000);
for(let i = 0; i < time.length; i++) {
if(ct > time[i]
&& ct <= (time[i+1] ? time[i+1] : 8.64e+7)) {
index = i;
break;
}
}
//
let timeout = 60000;
if(method === 'start') {
timeout = t.getSeconds() !== 0 ? (60 - t.getSeconds() * 1000) : 60000;
}
setInterval(Update, timeout);
//
$('.tvprog').find('li.--active').removeClass('--active');
$('.tvprog').find('li').eq(index).addClass('--active');
} Update('start');
.--active {
color: green;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="tvprog">
<li>
<span class="canals-time">07:00</span>
<span class="canals-program">Օրախնդիր</span>
</li>
<li>
<span class="canals-time">07:40</span>
<span class="canals-program">Ուղիղ խոսք</span>
</li>
<li>
<span class="canals-time">08:00</span>
<span class="canals-program">Հարցազրույց</span>
</li>
<li>
<span class="canals-time">08:30</span>
<span class="canals-program">Ռեպորտաժներ</span>
</li>
<li>
<span class="canals-time">09:00</span>
<span class="canals-program">Pressnig ՍԱԹԻԿ ՍԵՅՐԱՆՅԱՆԻ ՀԵՏ</span>
</li>
<li>
<span class="canals-time">09:40</span>
<span class="canals-program">Լուրեր Ոստիկանությունից</span>
</li>
<li>
<span class="canals-time">09:50</span>
<span class="canals-program">Լուրեր (Մարզերից)</span>
</li>
<li>
<span class="canals-time">14:40</span>
<span class="canals-program">12312</span>
</li>
<li>
<span class="canals-time">14:42</span>
<span class="canals-program">1231</span>
</li>
<li>
<span class="canals-time">14:44</span>
<span class="canals-program">1231</span>
</li>
</ul>