(Javascript) Как добавить таймер обратного отсчета к опции выбора

0

Я хотел бы добавить таймер обратного отсчета к опции выбора. Это фрагмент кода html:

<select id="patientSelect">
<option> Heart Attack, 65, ETA: <span id="timer"></span></option>
</select>

И javascript:

$(document).ready(function(){
var count=30;
var counter=setInterval(timer, 1000);

function timer(){
    count--;
    if(count <= 0){
        clearInterval(counter);
        return;
    }
    document.getElementById("timer").innerHTML=count + " secs";
}
});

Но он появляется только в том случае, если я помещаю id в тег option (который также удаляет все текущие html). Любая помощь приветствуется. :-)

Редактировать: Отлично, спасибо, ребята!

Теги:

2 ответа

3
Лучший ответ

Попробуй это

HTML

<select id="patientSelect">
<option id="timer">Heart Attack, 65, ETA: 30 secs</option>
</select>

JAVASCRIPT

$(document).ready(function(){
var count=30;
var counter=setInterval(timer, 1000);

function timer(){
    count--;
    if(count <= 0){
        clearInterval(counter);
        return;
    }
    document.getElementById("timer").innerHTML= "Heart Attack, 65, ETA: " + (count.toString()) + " secs";
}
});
1

Это из-за того, что ваша разметка недействительна, элементы option не могут иметь детей, вы можете выбрать option и добавить исходную строку с помощью JavaScript:

document.getElementById("timer").innerHTML = 'Heart Attack, 65, ETA:' +  count + " secs";

Ещё вопросы

Сообщество Overcoder
Наверх
Меню