生成下拉列表

时间:2009-11-03 10:30:03

标签: javascript drop-down-menu

我有一个href的列表,我想从中创建一个下拉列表。

如何在不使用jQuery的情况下实现这一目标?

我是javascript的新手......

2 个答案:

答案 0 :(得分:5)

var select = document.createElement("select");
for (var i=0; i<hrefs.length; i++) {
  var link = hrefs[i];
  var option = document.createElement("option");
  option.value = hrefs[i];
  option.innerHTML = i + ": " + hrefs[i]; // this is the label
  select.appendChild(option);
}
document.body.appendChild(select);

我不确定标签是否正确;这取决于你的hrefs列表的含义以及你想用标签做什么。我假设你有一系列链接,如[“http://google.com”,...]。

答案 1 :(得分:3)

如果你有JavaScript 1.6,你可以这样做:

var hrefs = ['http://stackoverflow.com', 'http://example.com'],
  select = document.createElement("select"),
  str = hrefs.map(function(l){
    return '<option>'+l+'</option>'
  });
select.innerHTML = str.join('');
document.body.appendChild(select);

您可以使用

模仿.map
if (!Array.prototype.map)
{
  Array.prototype.map = function(fun /*, thisp*/)
  {
    var len = this.length >>> 0;
    if (typeof fun != "function")
      throw new TypeError();

    var res = new Array(len);
    var thisp = arguments[1];
    for (var i = 0; i < len; i++)
    {
      if (i in this)
        res[i] = fun.call(thisp, this[i], i, this);
    }

    return res;
  };
}

(通过MDC - https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Objects/Array/map