的JavaScript getElementsByClassName方法不<select>

Question

我试图使用getElementsByClassName方法，使我选择的选项跳到取决于其网址上的值工作：

http://www.example.com/?page_id="value" 

这里是我做了什么：http://jsfiddle.net/VvLXk/2/

但它的不工作。

我知道我可以使用getElementByID，但我有三个选择元素（我可能会添加更多）。我相信它只适用于一个元素。并因此，我诉诸getElementsByClassName这是行不通的。

我的代码有什么问题？欢迎使用Javascript/JQuery解决方案。

Answer 1

这个问题已经在这里找到答案：How to use getElementsByClassName in javascript-function?

http://jsfiddle.net/VvLXk/9/这里是它的工作样本：

var dropdown = document.getElementsByClassName("page-dropdown")[0]; 
function onCatChange() 
{ 
    if (dropdown.options[dropdown.selectedIndex].value > 0) 
    { 

     location.href = "http://www.example.com/?page_id="+dropdown.options[dropdown.selectedIndex].value; 
    } 
} 

dropdown.onchange = onCatChange; 

Answer 2

正如How to use getElementsByClassName in javascript-function?讨论，getElementsByClassName()提供元素的集合。要分配一个事件处理程序，您必须遍历它并修改每个单独的元素。

for (var i = 0, l = dropdown.length; i < l; i++) { 
    dropdown[i].onchange = onCatChange; 
} 

伴随着这一点，你可以再引用该事件被触发与this处理程序function内的一个dropdown。

function onCatChange() { 
    if (this.options[this.selectedIndex].value > 0) { 
     // etc. 
    } 
} 

修改小提琴：http://jsfiddle.net/jLLHH/（注：原木而不是重定向）

Answer 3

你所选择将返回数组，请试试这个：

var dropdown = document.getElementsByClassName("page-dropdown"); 

function onCatChange() 
{ 
    alert(dropdown[0]); 
    if (dropdown[0].options[dropdown[0].selectedIndex].value > 0) 
    { 
     window.location.href = "http://www.example.com/?page_id="+dropdown[0].options[dropdown[0].selectedIndex].value; 
    } 
} 
dropdown[0].onchange = onCatChange; 

希望这有助于..干杯！