添加javascript选项选择

我想这个javascript创建选项从12到100在一个选择id="mainSelect"，因为我不想手动创建所有的选项标签。你能给我一些建议吗?谢谢

function selectOptionCreate() {

  var age = 88;
  line = "";
  for (var i = 0; i < 90; i++) {
    line += "<option>";
    line += age + i;
    line += "</option>";
  }

  return line;
}

当前回答

For(设I = 12;我< 101;我+ +){ 让HTML = "" HTML += ' <选项值= " ${我}" > ${我}> < /选项｀ mainSelect。innerHTML += html ｝ const mainSelect = document.getElementById("mainSelect") 这是一种非常简单易懂的解决问题的方法!希望它能起作用:)

2022-06-20 05:00:44

其他回答

通常你有一个相关记录的数组，我发现用这种方式填充select很简单，而且相当声明性:

selectEl.innerHTML = array.map(c => '<option value="'+c.id+'">'+c.name+'</option>').join('');

这将取代现有的选项。你可以使用selectEl。insertAdjacentHTML (afterbegin, str);把它们加到最上面。和selectEl。insertAdjacentHTML (beforeend, str);将它们添加到列表的底部。

兼容IE11的语法:

array.map(function (c) { return '<option value="'+c.id+'">'+c.name+'</option>'; }).join('');

2017-11-24 22:47:35

var selectElement = document.getElementById('ageselect');

for (var age = 12; age <= 100; age++) {
  selectElement.add(new Option(age, age));
}


Your age: <select id="ageselect"><option value="">Please select</option></select>

注意，该值作为第二个参数添加到new Option中

2022-09-15 05:08:03

2022-06-20 05:00:44

我要避免的一件事是在循环中执行DOM操作，以避免重复地重新呈现页面。

var firstSelect = document.getElementById('first select elements id'),
    secondSelect = document.getElementById('second select elements id'),
    optionsHTML = [],
    i = 12;

for (; i < 100; i += 1) {
  optionsHTML.push("<option value=\"Age" + i + "\">Age" + i + "</option>";
}

firstSelect.innerHTML = optionsHTML.join('\n');
secondSelect.innerHTML = optionsHTML.join('\n');

Edit:删除了该函数，以显示如何将已构建的html分配给另一个选择元素-从而通过重复函数调用避免不必要的循环。

2011-12-29 23:29:33

参见:用jQuery从数组中添加选项的最佳方法是什么?

$('#mySelect')
      .append($('<option>', { value : key })
      .text(value));

2011-12-29 23:23:02

添加javascript选项选择

推荐文章

最新文章

标签