getElementsByClassName（）不起作用

以下代码是按字母顺序对表单列表选项进行排序，但’getElementsByClassName（）’不起作用，我无法弄清楚原因。

我正在使用最新的jQuery。

window.onload=function(){ function sortlist() { var cl = document.getElementsByClassName('car_options'); var clTexts = new Array(); for(i = 1; i < cl.length; i++) { clTexts[i-1] = cl.options[i].text.toUpperCase() + "," + cl.options[i].text + "," + cl.options[i].value; } clTexts.sort(); for(i = 1; i < cl.length; i++) { var parts = clTexts[i-1].split(','); cl.options[i].text = parts[1]; cl.options[i].value = parts[2]; } sortlist(); } 

在身体部分

  
 
  By Make Vauxhall BMW Toyota Lexus Audi Ford    By Color Red Blue Black Grey    

Answer 1

使用document.getElementsByClassName('car_options')[0]

getElementsByClassName返回一组包含所有给定类名的元素。

如果你有多个元素，那么我们必须迭代它。 喜欢

 var elements = document.getElementsByClassName('car_options'); for (var i = 0; i < elements.length; i++) { elements[i].addEventListener('click', function() { }, false); } 

注意：在IE中，它在IE9 +上受支持

编辑

更新的代码

 function sortlist() { var elements = document.getElementsByClassName('car_options'); for (var j = 0; j < elements.length; j++) { var cl = elements[j]; var clTexts = new Array(); for (i = 1; i < cl.options.length; i++) { clTexts[i - 1] = cl.options[i].text.toUpperCase() + "," + cl.options[i].text + "," + cl.options[i].value; } clTexts.sort(); for (i = 1; i < cl.options.length; i++) { var parts = clTexts[i - 1].split(','); cl.options[i].text = parts[1]; cl.options[i].value = parts[2]; } } } 

工作演示

Answer 2

你的逻辑错了。

您正在迭代cl（这是所有选择列表的集合）。

然后通过相同的索引访问每个列表的选项。 您的代码生成数组越界exception