Select事件侦听器在forEach循环中不起作用

时间:2019-07-27 05:37:32

标签: javascript

选择事件侦听器在forEach循环中不起作用。

这是用于当用户选择一个值时将禁用输入标签的输入样式。

 var listOfSelect = document.querySelectorAll('select');
  var listOfInput = document.querySelectorAll('input');

  listOfSelect.forEach(function(element) {
    element.addEventListener('focus', function () {
      element.style.backgroundColor = "white";
    });
    element.addEventListener('blur', function () {
      element.style.backgroundColor = "#F0F0E7";
    });
    element.addEventListener('select', function () {
      console.log("OK")
    });
  });

我希望select事件将在该循环内起作用。

2 个答案:

答案 0 :(得分:1)

由于您正在使用select元素,也许您打算使用change eventselect event用于在文本输入中选择文本。

如果您确实打算使用select事件,那么您可能想遍历输入元素的数组而不是select元素的数组。

答案 1 :(得分:-1)

尝试使用更改事件:

var listOfSelect = document.querySelectorAll('select');
  var listOfInput = document.querySelectorAll('input');

  listOfSelect.forEach(function(element) {
  console.log(element);
   
     $(document).on('change', element, function()
    {
     element.style.backgroundColor = "blue";
    });
    

  });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select>
<option value=''>--select--</option>
<option value='1'>1</option>
<option value='2'>3</option>
<option value='3'>3</option>
</select>