请注意，我已更改您的 HTML（关闭 <select> 元素，并为与“语言选项”相关的元素添加类名：
<select id='languages'>
<option>French</option>
<option>English</option>
<option>German</option>
</select>
<select id='English' class='languageOption'>
<option>ENGLISHPROMO1</option>
<option>ENGLISHPROMO2</option>
<option>...</option>
</select>
<!-- other select elements removed for brevity -->
我还完全更改了您的功能，使其工作得更干净（尽管稍后在答案中我将解释您原始实现的问题，除了缺乏努力解决 iPad 对语法的坚持）。
这是一个看似有效的简单函数：
function PromoLanguage() {
// I've changed the variable-names, to something meaningful,
// which makes them easier to keep track of within the function:
var select = document.getElementById('languages'),
index = select.selectedIndex,
// you don't need the <option>, you need the <option>-value,
// if no value is set the value is the option's text:
language = select.options[index].value;
// using Array.prototype.forEach, and Function.prototype.call
// to iterate over the array-like NodeList returned by
// document.querySelectorAll() (which is supported in IE8,
// whereas getElementsByClassName() is not);
Array.prototype.forEach.call(document.querySelectorAll('.languageOption'), function (opt) {
// the first element of the anonymous function is the array-element
// itself, in this case a DOM-node, the <select> elements found by
// their class-name.
// here we're setting their display property to an invalid value,
// which removes the display property from their style attribute,
// and allows the CSS to style them once more:
opt.style.display = '';
});
// Finding the <select> element with the appropriate id,
// and showing it:
document.getElementById(language).style.display = 'block';
}
// in-line JavaScript is obtrusive, this binds the change
// event-handler to the element with an id='languages',
// and binds the named-function (note the lack of parentheses)
// as the event-handler:
document.getElementById('languages').addEventListener('change', PromoLanguage);
function PromoLanguage() {
var select = document.getElementById('languages'),
index = select.selectedIndex,
language = select.options[index].value;
Array.prototype.forEach.call(document.querySelectorAll('.languageOption'), function (opt) {
opt.style.display = '';
});
document.getElementById(language).style.display = 'block';
}
document.getElementById('languages').addEventListener('change', PromoLanguage);
select {
display: block;
}
select.languageOption {
display: none;
}
<select id='languages'>
<option>French</option>
<option>English</option>
<option>German</option>
</select>
<select id='English' class='languageOption'>
<option>ENGLISHPROMO1</option>
<option>ENGLISHPROMO2</option>
<option>...</option>
</select>
<select id='French' class='languageOption'>
<option>FRENCHPROMO1</option>
<option>FRENCHPROMO2</option>
<option>...</option>
</select>
<select id='German' class='languageOption'>
<option>GERMANPROMO1</option>
<option>GERMANPROMO2</option>
<option>...</option>
</select>
您的原始代码：
Function PromoLanguage() {
Var language = document.getElementById('languages');
Var a = language.selectedIndex;
If(a == 1) {
Document.getElementById('French').style.display = display;
}
Else
if (a == 2) {
Document.getElementById('English').style.display = display;
}
Else
if (a == 3) {
Document.getElementById('German').style.display = display;
}
}
JavaScript 区分大小写，Var 应该是var，If 应该是if；在 iPad 上打字，而不注意创建的错误是 understandable，但是发布带有额外中断的损坏代码是不好的，因为这会掩盖您自己的错误。
现在：
var a = language.selectedIndex;
if(a == 1) {
在这里，您错过了第一个选项，这将是 - 感谢 JavaScript 中的零索引 - a == 0。
另外，selectedIndex 将始终是一个数字，因此您应该使用 === 来确保您正在测试完全相等（数字相同，并且两个参数都是数字）。
然后：
document.getElementById('French').style.display = display;
在这里，您将一个变量分配给元素的 display 属性；您还没有定义该属性，那么它除了引发错误之外什么都不做（希望如此）。如果您在带有错误控制台的浏览器中键入此内容（尽管据称 iPad Safari 有，但我从未弄清楚如何访问它），您可以检查它报告的错误，其中会 - 希望 - 导致您遇到问题（如果您的代码事先没有被不正确的大写所阻碍）。