时间戳

首页 > 解决方案 > 为什么我的 addEventListener 函数在本地为变量赋值，而不是全局？

javascript - 为什么我的 addEventListener 函数在本地为变量赋值，而不是全局？

问题描述

我正在尝试用 Javascript、HTML 和 CSS 编写一个应用程序，在其中我通过输入字段从用户那里获取信息并将其保存到以后使用的变量中。我在脚本的开头分配了空的全局变量，然后应该在事件侦听器函数运行时重新分配这些变量。通过从函数内部和外部登录到控制台，我可以看到用户输入被分配给函数内的变量，而不是函数外的变量。

示例代码：

let inputName;

const person = document.getElementById('person');

function getName() {
  inputName = person.value;  
//if console.log(inputName) is here, the assigned value for inputName will be logged to the console
};

person.addEventListener('change', getName);
//if console.log(inputName) is anywhere outside of getName(), the value will not appear on the console

加上相应的 HTML：

<div>
   <label for='person'>What is your name?</label>
   <br>
   <input type='text' id='person' placeholder='John Doe' required>
</div>

我已经尝试了各种变体，但仍然没有找到解决方案；关于如何修复/重写这个的任何想法？

标签： javascriptfunctiondomscopeevent-listener

解决方案

好吧，我想通了。很想因为尴尬而删除线程，但会继续保持下去，因为我想我不是唯一一个被这种事情弄得措手不及的新手......

简而言之，最近才接触到事件侦听器，我忽略了脚本的运行速度比我在输入字段中输入名称的速度要快得多，因此会比我更早地运行 console.log()可以希望运行事件监听函数来赋值，不管我在哪里输入console.log()... Facepalm！无论如何，它看起来像@JakeAve 调用它 - 我一定会记得在未来使用 setTimeOut() 来解决这种事情，这是一个巧妙的策略。

感谢大家抽出宝贵时间提供帮助 - 非常感谢！

推荐阅读