javascript - 构造函数中的Javascript函数不适用于onclick

Question

我试图在我的构造函数 SmartButton 中运行一个名为 makeHighlight 的函数。makeHighlight 应该在我单击 SmartButton 对象（一个图像元素）时运行，这就是我将属性“onclick”设置为 makeHighlight 的原因。我无法让它工作，它要么根本不运行，要么在页面加载时立即运行。

function SmartButton(buttonId, defaultImage, highlightImage, helpMsg) {
    var newLink = document.createElement('a');
        newLink.setAttribute('href', '#');

    var newImg = document.createElement('img');
        newImg.setAttribute('src', defaultImage);
        newImg.setAttribute('id', buttonId);
        newImg.setAttribute('onclick', "makeHighlight()");

    document.body.appendChild(newLink);
    newLink.appendChild(newImg);

    this.buttonId = buttonId;
    this.defaultImage = defaultImage;
    this.highlightImage = highlightImage;
    this.helpMsg = helpMsg;

    function makeHighlight() {
        newImg.setAttribute('src', highlightImage);
        console.log(this);
    }

}   

button1 = new SmartButton('button1', 'button1off.jpg', 'button1on.jpg', 'sup');

Answer 1

你定义makeHighlight的SmartButton功能范围。因此newImg，单击时看不到它。试试这个代码（里面SmartButton）：

function makeHighlight() {
    newImg.setAttribute('src', highlightImage);
    console.log(this);
}
newImg.onclick = makeHighlight;

（注意最后一行缺少括号）并删除此行：

newImg.setAttribute('onclick', "makeHighlight()");