我有一个带有选择控件的iframe,我想添加一些选项。我可以使用IE10 +,Firefox和Chrome为iframe中的选项添加选项,但我目前的解决方案不适用于IE8和IE9。
我想找到一种方法来为我的select控件添加选项。我已经尝试过针对其他堆栈溢出问题提出的几个解决方案,但它们似乎对我没用。
以下是我的HTML视图的相关部分:
<!-- In the iframe -->
<div>
<div class="inline-block">SelectSomething: </div>
<select name="select-dialog" id="select-dialog" class="inline-block"></select>
</div>
以下是我的javascript代码片段,它尝试向上面的选择控件添加选项:
// Grab select from iframe
var dialogSelect = document.getElementById('myFrame').contentWindow.document.getElementById('select-dialog');
var isIE8 = (isIE && getIEVersion() === 8);
if (isIE8)
{
dialogSelect.innerHTML = '';
// Attempt 1
var opt = new Option();
opt.innerHTML = 'Kobe';
opt.value = 'BlackMamba';
var opt2 = new Option();
opt2.innerHTML = 'RKelly';
opt2.value = 'PiedPiper';
dialogSelect.appendChild(opt);
dialogSelect.appendChild(opt2);
// Attempt 2
// var opt = dialogSatelliteSelect.options;
// opt[0] = new Option('Kobe', 'BlackMamba');
// opt[1] = new Option('R Kelly', 'PiedPiper');
console.log('innerHTML: ' + dialogSelect.innerHTML);
}
else
{
// The select is not populated with options in IE8 and IE9. This works with other browsers
dialogSelect.innerHTML = getOptions();
}
尝试1和2的控制台输出是:
innerHTML: <OPTION value=BlackMamba selected>Kobe</OPTION><OPTION value=PiedPiper>RKelly</OPTION>
即使innerHTML包含我创建的选项,我也无法使用IE8 / IE9选择它们。下拉列表显示为空白,未选择任何内容。
在我的选择控件中显示这些选项需要做什么?我需要采取一些特殊步骤来使用IE8来显示当前的选项吗?