Question

我在HTML5按钮上附加onclick事件时遇到问题。我正在尝试根据参数动态生成按钮行：

    var buttons: { 
      'Save': () => console.log('Save'),
      'Edit': () => console.log('Edit'),
    };

以及生成过程：

private getButtons(): string {
  let buttons: string = '';
  Object.entries(this.buttons).map(([key, value]: [string, () => any]) => {
    buttons += ` <button onclick="${value}">${key}</button>`
  });

  return buttons;
}

我尝试了多种方法将此功能添加为onclick / onClick事件，但没有成功。什么都没发生，或者我出现错误：

未捕获的SyntaxError：函数语句需要函数名称。

当我在地图函数中放置断点并调用value()时，它会返回预期的值。

我想获得名称等于特定键且具有onClick事件的按钮，该按钮将触发函数作为上面的对象中的值传递。重要的是，我不能同时使用jQuery和其他dom支持库。

Answer 1

我不确定为什么这很困难？除非您使用this关键字或使用某种'string'，否则在这些情况下，第一个参数将成为event对象。作为一种好习惯，我不再使用e（现在仅event），因为我将e用作其他实践的变量。

JavaScript

function function_name(event) {console.log(event);}

HTML

<button onclick="function_name(event);">test</button>

我还没有找到一种有价值的标准化addEventListener的方法，因此，尽管许多人不愿使用事件属性（onclick=""），但您需要通过使变得有些个性化 em>合理的假设。

动态生成的带有附加onClick事件的按钮

1 个答案: