Javascript - innerHTML 不适用于 HTML 选择菜单

Question

在我的 HTML 页面中，我有 2 个选择菜单，ID 为“月”和“日”- 页面加载时“日”为空，“月”有 12 个选项，值 1-12 对应于 1 月 - 12 月。

“month”有一个 onchange 事件调用这个函数:

function showOutboundDays(month)
{
if(month==4 || month==6 || month==9 || month==11)
    document.getElementById('day').innerHTML='<option value="1">1</option><option value="2">2</option>'; etc. up to 30
else if(month==2)
    document.getElementById('day').innerHTML='<option value="1">1</option>'; etc. up to 28
else 
    document.getElementById('day').innerHTML='<option value="1">1</option>'; etc. up to 31
}

(想象一下选项标签周围有大括号可以帮助您查看...)

我认为很清楚地看到了我正在努力实现的目标...除了 ID 为“day”的选择的 innerHTML 根本没有填充之外，无论您选择哪个月份，一切都很好.我知道问题出在函数的这个阶段，因为当我将 if、elseif 和 else 代码更改为警报或类似的东西时，它工作正常。

有人知道 innerHTML 的问题是什么吗？

谢谢

编辑:使用 Firefox 3.6

Answer 1

I would suggest simply not to use innerHTML on a select - it just seems wrong. select elements have easy to use methods to add new options:

`document.getElementById('day').options.add(new Option("1", "1"))`

上述对象创建中的参数是:

new Option("optionText", "optionValue")

只是想添加到这个答案中，因为它可能会向看到这篇文章的人澄清。