即使语法正确，Eval() 也不执行答案

【问题标题】：Eval() not executing even though syntax is correct即使语法正确，Eval() 也不执行
【发布时间】：2021-04-28 17:48:50
【问题描述】：

我正在尝试使用 eval() 执行事件侦听器

["document.addEventListener('load', "].forEach(f => {
  eval(f + `function(){ console.log("test") })`)
})

但是控制台从不记录。当我用 console.log 替换 eval() 时，它表明该字符串具有正确的语法

["document.addEventListener('load', "].forEach(f => {
  console.log(f + 'function(){ console.log("test") })');
}) // logs 'document.addEventListener('load', function(){ console.log("test") })'

那么如果语法正确，那有什么问题呢？

当我从字符串中删除“function()”并直接触发“console.log”时，它可以工作。

["document.addEventListener('load', "].forEach(f => {
  eval(f + 'console.log("nice"))');
}) // this works

【问题讨论】：

事件监听器仅在可能已经发生的加载事件上触发
@Scrapper142 但是当我从字符串中删除 'function()' 并直接触发 'console.log' 时，例如 eval(f + 'console.log("nice"))'，它作品。如果是已经加载了窗口，那这两种方式都行不通吗？
在第二个示例中，其评估的字符串最终为'document.addEventListener('load', console.log("nice"))'，因此由于您直接执行console.log("nice")，因此它会执行它（即在打印时），然后添加事件处理程序变为未定义
啊，你是对的。我可以使用 document.addEventListener('load") 的替代方法吗？我需要在应用程序启动时执行此功能。
是的，实际的 eval() 内容将设置 innerHTML 值。我需要在应用程序启动时设置 innerHTML 值，然后在输入滑块时设置（这就是我做 forEach 的原因，第二个字符串将是用于输入元素的 eventListener。）

标签： javascript syntax eval

【解决方案1】：

因为答案较长而移至此处

您可以尝试使用代码字符串的函数，并在页面加载后立即运行它，否则添加事件侦听器

function runWhenLoaded(codeString) {
  if (document.readyState === 'complete') { // checks if it is loaded already
    eval(codeString);
  else {
    document.addEventListener('load', () => eval(codeString));
  }
}

【讨论】：

然后你可以为滑块添加另一个事件监听器