Javascript从许多选择列表中获取选定索引

我正在尝试创建政府网站的类别，用户可以从选择列表中单击，并将其定向到该位置。问题是我无法从这么多的选择列表中获取selectedIndex，或者我在其他地方搞砸了。选项值包含链接。这里有一个链接可以使用

HTML

从下面的下拉列表中选择一个站点

行政部门
选择一个网站
白宫
农业部
商务部
国防部
教育部
能源部
卫生和公共服务部
美国国土安全部
住房和城市发展部
内政部
律政司
劳工部
国务院
财政部
立法部门
选择一个网站
众议院网站
代表的网站
众议院书记员
国会名录
参议院网站
参议员网站
参议院历史办公室
国会季刊
国会图书馆
政府问责局
国会预算办公室
美国政府出版局
政府纪录及刊物
司法部门
选择一个网站
美国法院
美国最高法院
美国上诉法院
美国地区法院
州政府
选择一个网站
网络上的州和地方政府
阿拉巴马州
阿拉斯加州
亚利桑那州
阿肯色州
加利福尼亚
科罗拉多州
康涅狄格州
特拉华州
哥伦比亚特区
佛罗里达州
佐治亚州
夏威夷
爱达荷州
伊利诺伊州
印第安纳州
爱荷华州
堪萨斯州
肯塔基州
路易萨那
缅因州
马里兰
马萨诸塞州
密歇根
明尼苏达州
密西西比
密苏里州
蒙大拿
内布拉斯加州
内华达州
新罕布什尔州
新泽西州
新墨西哥州
纽约
北卡罗来纳州
北达科他州
俄亥俄州
奥克拉荷马
俄勒冈
宾夕法尼亚
罗德岛
南卡罗来纳州
南达科他州
田纳西州
得克萨斯州
犹他州
佛蒙特州
弗吉尼亚州
华盛顿
西弗吉尼亚州
威斯康星州
怀俄明州
​

Javascript

window.onload = init;

function init()
{
    var allSelect = document.getElementsByTagName('select');

    for(var i = 0; i < allSelect.length; i++)
        allSelect[i].addEventListener('onchange', loadLink());
}

function loadLink()
{
    var allSelect = document.getElementsByTagName('select');

    for(var i = 0; i < allSelect.length; i++)
        if(allSelect[i].selectedIndex > 0)
            alert(allSelect[i].options[selectedIndex].value);
}​

window.onload=init；
函数init（）
{
var allSelect=document.getElementsByTagName（'select'）；
对于（变量i=0；i0）
警报（所有选择[i]。选项[selectedIndex]。值）；
}​

当您调用

addEventListener

时，您需要传递对函数的引用，但您是通过在函数后面包含括号来调用该函数的。另外，当使用

addEventListener

时，事件是

'change'

，而不是

'onchange'

（从所有事件中删除“on”以与

addEventListener

一起使用）。因此：

在第二个函数的这一行中：

alert(allSelect[i].options[selectedIndex].value);

您正在使用未定义的变量

selectedIndex

。这句话应该是：

alert(allSelect[i].options[allSelect[i].selectedIndex].value);

另外，在小提琴中，您实际上没有调用

init（）

以下是一个“工作”版本：

---

演示：

当您调用

addEventListener

时，您需要传递对函数的引用，但您是通过在函数后面包含括号来调用该函数的。另外，当使用

addEventListener

时，事件是

'change'

，而不是

'onchange'

（从所有事件中删除“on”以与

addEventListener

一起使用）。因此：

在第二个函数的这一行中：

alert(allSelect[i].options[selectedIndex].value);

您正在使用未定义的变量

selectedIndex

。这句话应该是：

alert(allSelect[i].options[allSelect[i].selectedIndex].value);

另外，在小提琴中，您实际上没有调用

init（）

以下是一个“工作”版本：

---

演示：

您没有调用函数

init（）

，也没有像JSFIDLE中的示例那样分配事件，但请检查下面的示例

---

您没有调用函数

init（）

，也没有像JSFIDLE中的示例那样分配事件，但请检查下面的示例

---

谢谢！我想知道添加事件时

function（）

和

function

之间有什么区别。不客气

someFunc（）

调用该函数，但

someFunc

是对该函数的引用。请注意，您已经使用

window.onload=init。另外，我更新了我的答案，提到您不需要通过循环所有选择来获得更改的值，因为在事件处理程序
中，this
是对相关元素的引用。（一开始我忘了提到这一点，因为我专注于纠正那些阻止代码正常工作的事情。）谢谢！我想知道添加事件时
function（）
和
function
之间有什么区别。不客气
someFunc（）
调用该函数，但
someFunc
是对该函数的引用。请注意，您已经这样做了
window.onload = init;

function init()
{
    var allSelect = document.getElementsByTagName('select');

    for(var i = 0; i < allSelect.length; i++)
        allSelect[i].addEventListener('change', loadLink, false);    
}

function loadLink()
{
    var allSelect = document.getElementsByTagName('select');

    for(var i = 0; i < allSelect.length; i++)
        if(allSelect[i].selectedIndex > 0)
            alert(allSelect[i].options[allSelect[i].selectedIndex].value);
}

function loadLink()
{
    alert(this.value);
}