如何在与jQuery相同的函数中设置依赖于事件处理程序的变量？

Question

我正在为一些jQuery开发人员做一些可能很简单的事情而苦苦挣扎。

我想通过两个事件处理程序传递一个变量，并在事件之外获得最终值。

function myfunction(){

 var val = "";

 $(document).on('keyup',function(e) {
   if(e.which == 13) {
     val = "keyup";
     console.log(val);  
   }
 });

 $('#list li').click(function() {
   val = "click"
   console.log(val); 
 });

 console.log('final val =' + val);

}


$(document).ready(function(){
 myfunction();
});

所以基本上，我应该在控制台中得到两条带有相同“val”的消息！

有什么办法让它工作吗？

如果有任何信息缺失，请在评论区让我知道！

Answer 1

您似乎不了解回调是如何工作的。让我解释一下。您有两个事件，一个针对document上的keyup，另一个针对click上的li元素。它们接收一些函数作为参数。在您的代码运行时，您传递给事件处理程序的函数只被定义，而不被执行，这是完全合乎逻辑的，因为在这一点上，不会发生触发它们的事件。因此，回调是定义的行为，当发生某些事情时会触发这些行为。

因此，您误解的是，您混淆了事件处理程序的定义和它们的执行。但是，在它们的定义点，它们没有被执行，就在为一个变量调用它们的定义console.log之后，该变量由于缺少触发其初始化的事件而尚未初始化。

回调是事件发生时“回调”的函数。

例如，如果你给某人打电话，让他/她来拜访你，那么主动地在门外等他们是没有意义的。当他到达的时候，他会给你回电话，因为发生了一件事。就回调而言，这种行为在函数级别上非常相似

 $(document).on('keyup',function(e) { //when keyup on document, much later than the call of myFunction happened
   if(e.which == 13) {
     val = "keyup";
     console.log(val);  
   }
 });

 $('#list li').click(function() { //when clicking on li, much later than the call of myFunction happened
   val = "click"
   console.log(val); 
 });

 console.log('final val =' + val); //At the call of myFunction at page load

由于document上的keyup和li元素上的click随时可能发生，因此讨论val的最终值没有多大意义。由于keyup和click很少同时发生，因此在给定时刻确定val的最终值似乎是在处理边缘情况。如果这是您想要的，那么您可以使用信号量行为。