Question

我有一个带有几个下拉菜单的程序，为简单起见，每个下拉菜单都存储在一个数组中。我需要创建一个在选择新选项时激活的事件。这是我试过的：

  questionFormatList[counter] = document.createElement( "select" );
  questionFormatList[counter].id = counter;
  questionFormatList[ counter ].text = "Multiple Choice";

  //fill the dropdown menu with the four options
  for( var j = 0; j < 4; j++ )
  {
     questionFormatListOptions = document.createElement( "option" );
     dropDownMenuQuestionTextNode = document.createTextNode( questionTypes[ j ] );
     questionFormatListOptions.appendChild( dropDownMenuQuestionTextNode );
     questionFormatList[ counter ].appendChild( questionFormatListOptions );
  }
questionFormatList[counter].addEventListener( "change", function(){alteredSelection(questionFormatList[ counter ] );});

但它只是忽略了它。这三个变量是全球性的。请指教。我不是专业人士所以也许这很简单。我假设它与听众有关。

Answer 1

您在最后创建的选择菜单上调用addEventListener。如果你想打电话所有三个选择菜单上的事件监听器都尝试。

selects = document.getElementsByTagName('select');
for( var j = 0; j < select.length; j++ )
{
  selects[i].addEventListener('change',function(){alteredSelection(selects[j])},false);
}

这将在所有选择上启用eventlistener。保持在控制台中查看问题的习惯，并使用console.log和console.dir。它一直帮助我。希望这有帮助。

Answer 2

如Akurn所示，您的问题是由于不正确地使用了闭包范围变量计数器。尝试使用此代码而不是最后一行：

(function(list) {
    list.addEventListener( "change", function() {
        alteredSelection(list);
    } );
})(questionFormatList[counter]);

这是questionFormatList[counter]与添加事件侦听器时的实际值的绑定结果。

BTW：代码的第3行和第4行正在写入属性.text。

从下拉菜单选择中将全局变量传递给函数

2 个答案: