Question

我正在用Javascript代码动态创建DOM元素，并且试图添加一个匿名函数作为onclick事件处理程序。这是我的代码：

var onClickFunction = "(function(){var x = document.getElementById('onPrsClickButton'); x.value = this.id; x.click();})()";

var libelle = '<div onclick=' + onClickFunction + '></div>'

但是，每当我单击此<div>时，控制台都会显示此错误：

SyntaxError: Unexpected end of input

有人知道为什么吗？谢谢！

Answer 1

打印输出为

<div onclick=(function(){var x = document.getElementById('onPrsClickButton'); x.value = this.id; x.click();})()></div>

这不是有效的HTML属性值。
要使其有效，必须将该值括在引号（“）或撇号（'）中。
一些浏览器可以承受某种程度的滥用，例如不编写正确的语法，但是这种行为是不可信的。

此外，您的代码具有IIFE（立即调用函数表达式）。这意味着该函数内部的代码将立即执行，而不是单击时执行（尽管我不确定在这种情况下的实际行为）。

要使示例工作正常，您可以执行以下操作：

var onClickFunction = function(){
    // Your event handler
};

var libelle = '<div onclick="javascript:onClickFunction();"></div>'

但是解决问题的最佳方法（IMO）是为点击添加监听器，如下所示：

var libelle = document.getElementById("libelle");
libelle.addEventListener('click', function(){
    // Your event handler
});

匿名函数错误：SyntaxError：输入意外结束

1 个答案: