Question

我想在选择选项中添加倒数计时器。这是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放入选项标签（它也会删除所有当前的html）时才显示出来。任何帮助表示赞赏。： - ）

编辑：完美，谢谢你们！

Answer 1

试试这个

<强> 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";
}
});

Answer 2

那是因为你的标记无效，option个元素不能有子节点，你可以选择option并使用JavaScript预先添加原始字符串：

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

（Javascript）如何向选择选项添加倒数计时器

2 个答案: