javascript - 事件监听器为什么我不能使用这个词

Question

所以基本上我想问你的是，当我使用具有参数的函数的事件监听器时，为什么我不能在函数中使用单词 this ，这是给你的一个例子，因为我无法正确解释它。

    var elUsername = document.getElementById('username');
    var elMsg = document.getElementById('feedback');

    function checkUsername(minLength){
        if (elUsername.value.length < minLength){
            elMsg.textContent = 'ur username must contain at least 5 chars';
        }else {
            elMsg = "";
        }
    }
    elUsername.addEventListener('blur', function(){checkUsername(5)}, false);
------------------------------------------------------------
 function checkUsername(){
      var elMsg = document.getElementById('feedback');
      if (this.value.length <5){
          elMsg.textContent = 'usename must be 5 chars or more';
      }else {
          elMsg.textContent='';
      }

  }
    var elUsername = document.getElementById('username');
    elUsername.onblur = checkUsername;

所以函数中的第二个例子在 if 语句中没有参数我可以使用它，但在第一个例子中我不能 some1 解释为什么会这样？

Answer 1

这是因为您正在从事件监听器中的匿名函数内部调用 checkUsername 方法(如果您进行更改)

elUsername.addEventListener('blur', function(){checkUsername(5)}, false);

到

elUsername.addEventListener('blur', checkUsername, false);

并在函数内部进行值检查(如第二个代码示例)，它将起作用。

发生这种情况是因为当您调用 checkUsername 时未传递“this”的范围，这是可能的，但您必须使用 .call() 方法来调用它。就像这样:

elUsername.addEventListener('blur', function(){checkUsername.call(elUsername, 5)}, false);

现在，elUsername 作为 this 传递给 checkUsername 函数。

尽管我更愿意直接调用 checkUsername 函数并从那里进行计算。