使用来自另一个函数的对象参数调用函数

Calling function with object parameter from another function

本文关键字:函数 对象 参数 调用 另一个      更新时间:2023-09-26

我的目标很简单:我想拦截右键和左键按下,并相应地执行特定的JavaScript。特别是,我的HTML中有两个img元素,它们基本上是一个左箭头和一个右箭头来更改中心图片:

<img id="goleft" onclick="changePic(this)" src="x"/>
<img id="goright" onclick="changePic(this)" src="y" />

因此,函数changePic(this)捕获调用方对象(向左或向右箭头(并相应地更改源。但是,出于采样目的,我们在这里假设它只会在警报中显示对象的 id:

function changePic(obj) {
    alert("hello world");
    alert(obj.id);
}

一切都很好,直到这里。在单击事件时,Javascript 被正确调用。但是,现在我正在实现一个系统来捕获键右键和键左键并执行相同的操作。以下函数将捕获任何按键事件:

document.onkeydown = function (evt) {
    evt = evt || window.event;
    switch (evt.keyCode) {
        case 37:
            leftArrowPressed();
            break;
        case 39:
            rightArrowPressed();
            break;
    }
};

。而且,很明显,我认为"leftArrow"和"rightArrow"这两个函数可以简单地做到这一点:

function leftArrowPressed() {
    changePic(document.getElementById("goLeft"));
}
function rightArrowPressed() {
    changePic(document.getElementById("goRight"));
}

但是,这不起作用。函数 leftArrowPressedrightArrowPressed 被正确调用(使用警报进行测试(,但调用函数changePic(因为我看到警报"hello world"弹出,但在"obj.id"调用时失败(。所以我相信这个问题与我将对象从调用方传递到侦听器函数的方式有关:任何人都可以告诉我我做错了什么?

附言我是这种语言的新手,所以请不要犹豫,告诉我任何我认为与回答问题无关但实际上并非如此的事情。

Id 区分大小写,您的 id goleft,但您尝试使用 goLeft 查找它。

我建议对你的代码进行一个小的更改,这可能会让你的生活更轻松:

<img id="goleft" onclick="leftArrowPressed()" src="x"/>
<img id="goright" onclick="rightArrowPressed()" src="x"/>

changePic()函数更改为使用字符串而不是元素,这将使事情变得更容易一些。

如果你想坚持你目前的实现:你在查找中使用goLeft,它应该是goleft的。区分大小写!