调用 mouseover 回调时出现 js 语法错误答案

【问题标题】：js syntax error when invoking mouseover callback调用 mouseover 回调时出现 js 语法错误
【发布时间】：2010-11-26 23:14:57
【问题描述】：

我有一些 javascript 代码创建一个带有鼠标悬停回调的 img 标签，并将 img 标签添加到页面。问题是每当调用回调时都会发生 javascript 语法错误（在 Firefox 控制台中）。

此代码演示了问题...

var imgUrl = 'http://sstatic.net/so/img/logo.png'; var img = document.createElement('img'); img.setAttribute('src', imgUrl); img.setAttribute('onmouseover', function() { alert('鼠标悬停' + imgUrl); }); document.body.appendChild(img);

当回调函数为空函数时，甚至会发生语法错误。

谁能解释导致语法错误的原因以及如何解决？

（我在 Win XP 上使用 FF 3.5.2。）

【问题讨论】：

你能更新你的问题并输入你得到的错误吗？

标签： javascript callback syntax-error

【解决方案1】：

您正在传入一个需要字符串的函数。试试这个：

    var imgUrl = 'http://sstatic.net/so/img/logo.png';
    var img = document.createElement('img');
    img.src = imgUrl;
    img.onmouseover = function() {
        alert('mouseover ' + imgUrl);
    };
    document.body.appendChild(img);

【讨论】：

它有效，但我仍然不确定为什么，你改变了什么？
函数被直接分配给方法，而不是通过 setAttribute 函数，其中需要一个字符串。比我的更清洁的解决方案。 +1
@CrazyJugglerDrummer：setAttribute 方法需要 2 个字符串 - 所以您可以使用该方法，但您必须将函数用双引号括起来，这也可能导致访问 imgUrl 值时出现问题因为现在它将在全局范围内查找。