在DOM事件上向函数发送参数

Question

我正在尝试向javascript事件的函数调用发送参数。

在接收焦点文本的下拉菜单上，某些地方会根据传递给函数调用的参数而有所不同。

无法执行此工作！任何帮助，将不胜感激。

function changeText(x) {
  if (x) {
    document.querySelector('.focused').textContent = 'Focused';
  } else {
    document.querySelector('.focused').textContent = 'LOST';
  }
}

document.querySelector('.selector').onfocus = changeText(true);
document.querySelector('.selector').onfocusout = changeText(false);

<select class='selector'>
  <option value = 'one'>One</option>
  <option value = 'two'>Two</option>
</select>

<br />
<br />
<br />


<div class = 'focused'>XXX</div>

Answer 1

更改：我使用匿名函数来包装您的函数。我使用了addEventListener（'focusin'/'focusout'），因为失去焦点时不会触发“ onfocusout”。

function changeText(x) {
  if (x) {
    document.querySelector('.focused').textContent = 'Focused';
  } else {
    document.querySelector('.focused').textContent = 'LOST';
  }
}

document.querySelector('.selector').addEventListener('focusin',function(){ changeText(true); });
document.querySelector('.selector').addEventListener('focusout',function(){ changeText(false); });

<select class='selector'>
  <option value = 'one'>One</option>
  <option value = 'two'>Two</option>
</select>

<br />
<br />
<br />


<div class = 'focused'>XXX</div>