内联点击处理程序不起作用

Inline onclick handler does not work

本文关键字:程序 不起作用 处理      更新时间:2023-09-26

我想使用内联回调函数,所以我有以下html标记:

    var callback = function (index) {
        return function () {
            return action.delete({
                index: index
            })
        }
    }
    var markup = items.map(function (item, index) {
        return ('<button onclick="return ' + callback(index) + ';">Delete</button>')
    }).join(''n') 
    document.getElementById('main').innerHTML = markup

但是当我单击按钮时,我的回调不起作用。上面的代码有什么问题?谢谢。

在您的情况下,callback(index)返回函数,但是当它与字符串连接时.toString()函数方法隐式调用并以字符串形式返回函数体。

您的代码应如下所示:

var callback = function (index) {
     return action.delete({
        index: index
     });
}
var markup = items.map(function (item, index) {
    return ('<button onclick="return callback(' + index + ');">Delete</button>')
}).join(''n') 
document.getElementById('#main').innerHTML = markup

在这种情况下callback必须在全局范围内定义函数。

最好使用 addEventListener 为 Click 事件设置侦听器功能。