Javascript - innerHTML无法使用HTML选择菜单 [英] Javascript - innerHTML not working with HTML select menus
问题描述
在我的HTML页面中，我有2个选择菜单ID为月和日 - 页面加载时日为空，月有12个选项，值1-12对应于1月 - 12月。
In my HTML page I have 2 select menus with IDs "month" and "day" - "day" is empty when the page loads, "month" has 12 options with values 1-12 corresponding to January - December.
月有一个onchange事件调用此函数：
"month" has an onchange event which calls this function:
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
}
（想象一下，选项标签周围有大括号可以帮助你看...）
(just imagine there are braces around the option tags to help you see...)
我认为我很清楚看到我想要的是什么实现...并且除了IDday的selectHT的innerHTML之外，一切正常，无论你选择哪个月，都不会被填充。我知道问题出在函数的这个阶段，因为当我将if，elseif和else代码更改为警报或类似的东西时，它工作正常。
I think it's pretty clear to see what I'm trying to achieve...and everything works fine apart from the innerHTML of the select with ID "day" doesn't get filled at all, regardless of what month you pick. And I know the problem is with this stage of the function because when I change the if, elseif and else code-to-be-executed to alerts or something similar, it works fine.
有人知道innerHTML的问题是什么吗？
Does anybody know what the problem with the innerHTML is?
谢谢
编辑：使用Firefox 3.6
Using Firefox 3.6
推荐答案
这是IE的已知问题。
KB解决方法的文章：
http://support.microsoft.com/kb/276228
KB article with workaround: http://support.microsoft.com/kb/276228
另外：dupe of：
innerHTML替换不反映
Also: dupe of: innerHTML replace does not reflect
编辑：这是我的工作样本基于您的代码：
Here is my working sample based on your code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Selects</title>
<meta http-equiv="content-type" content="application/xhtml+xml; charset=UTF-8" />
<style rel="stylesheet" type="text/css">
</style>
<script>
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>';
else if(month==2)
document.getElementById('day').innerHTML='<option value="1">3</option><option value="1">4</option>';
else
document.getElementById('day').innerHTML='<option value="1">5</option><option value="1">6</option>';
}
</script>
</head>
<body>
<select onchange="showOutboundDays(this.value);">
<option value="1">January</option>
<option value="2">February</option>
<option value="3">March</option>
<option value="4">April</option>
<option value="5">May</option>
<option value="6">June</option>
<option value="7">July</option>
<option value="8">August</option>
<option value="9">September</option>
<option value="10">October</option>
<option value="11">November</option>
<option value="12">December</option>
</select>
<br />
<select id="day">
</select>
</body>
</html>
这篇关于Javascript - innerHTML无法使用HTML选择菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
