从Javascript事件处理程序中引用文档作用域

时间:2018-11-25 21:33:18

标签: javascript

我在表单控件(输入类型-编号)上有一个非常简单的事件处理程序(更改),我想根据输入的值做一些工作。配合使用'this'关键字,效果很好。

当我尝试检查另一个控件的值(另一个输入类型-编号)时,我遇到了范围问题。我了解这是一个范围问题,但我只是想不通如何从第一个控件的事件处理程序中引用第二个控件。

例如;

if (this.value) != "" { do something }

效果很好,但是;

if (this.value != "" && document.getElementById("someothercontrol").value) != "") { do something else }

失败。正如我所指出的,我意识到这个文档对象超出了范围,但是我不知道引用它的语法(我想有办法)。

1 个答案:

答案 0 :(得分:0)

只需将对输入元素的引用保存在更高的范围内,这是一个示例:

const inputs = document.querySelectorAll('input');
const input1 = document.getElementById('input1');
const input2 = document.getElementById('input2');

for (let input of inputs) {
  
  input.addEventListener('change', () => {
    
    console.log(input1.value);
    console.log(input2.value);
    
  })
}
<input id="input1" type="text">
<br>
<input id="input2" type="text">

如果您不希望变量位于全局范围内,则可以将其放在立即调用的函数表达式中:

(() => {
   // your scoped code here
})()