0

我有下面的代码来动态填充选择框。这在除 FireFox 3.6 之外的所有浏览器中都可以正常工作

var option25 = document.createElement("option");
option25.text = '25 miles';
option25.value = 25;
if(rad == '25')
{
    option25.selected = 'selected';
}
var combo = document.getElementById('ddlProximity_' + controlId);
combo.add(option25); //not working in FF3.6

有什么建议么

4

3 回答 3

1

选择元素的add方法在 Gecko 7 之前的版本（MDN）中采用两个参数。

在 IE 中，它只需要一个参数，或者如果它是 IE 8 标准模式下的 IE 8 或MSDN则需要两个参数。

如果我们add在 Firefox 3.6.28、Firefox 15.0.1 和 IE 9 中调用 krg 的代码并在调用它之前检查它的数量：

if (typeof combo.add === 'function') {
    if (combo.add.arity === 1) {
        combo.add(option25);
    } else {
        combo.add(option25, null);
    }
} else if (typeof combo.appendChild === 'function') {
    combo.appendChild(option25);
}

​</p>

于 2012-10-07T22:01:22.340 回答
0

假设组合是一个选择菜单，请参见这个jsFiddle示例。

if (typeof combo.add === 'function') {
    combo.add(option25);
} else if (typeof combo.appendChild === 'function') {
    combo.appendChild(option25);
}

​</p>

于 2012-10-07T21:13:47.643 回答
0

如果您想确保您的 JS 代码适用于各种浏览器，我会使用 jQuery 等 JavaScript 框架来执行 DOM 操作。JS 框架已经解决了大部分跨浏览器问题并将它们的处理抽象化，因此您不必担心编写代码来解决特定浏览器中的问题。这是 jQuery 的网站：http: //jquery.com/。

现在要完成您的示例在 jQuery 中所说的内容，您将执行以下操作：

var option25 = $('<option>').val(25).text('25 miles');
if (rad == '25') {
    option25.attr('selected', 'selected');
}

var combo = $('#ddlProximity_' + controlId);
combo.append(option25); // Will work in all browsers supported by jQuery

如果您真的想在没有任何 JS 框架的情况下执行此操作，我会在这里查看：http: //www.w3schools.com/jsref/met_select_add.asp。add 方法应该可以工作，但是在 8 之前的 IE 版本中有一些警告，并且您的页面必须具有正确的 DOCTYPE 声明。您也可以尝试 appendChild，但我会在一些浏览器中对其进行测试，看看是否能满足您的需求。

于 2012-10-07T21:23:03.203 回答