0

我正在尝试在 Javascript 的幻灯片中使用鼠标事件。如何使用 keyup 事件更改图像?如果我KeyUp在文本框中使用它可以工作,但是当我在下面的图像上使用它时它不起作用。

<script>
    var image=document.getElementById("x")
    image.addEventListener("keyup",displaykey,false)
    image.addEventListener("click",previous,false)
    image.addEventListener("contextmenu",next,false)

    var step=1;
    function previous()
    {
      step--;
      if(step==0)
      {
          step=3;
      }
      document.slide.src=eval("show"+step+".src")
    }
    function next(event)
    {
      step++;
      if(step==4)
      {
          step=1;
      }
      document.slide.src=eval("show"+step+".src")
      event.preventDefault()
    }

    function displaykey(event)
    {
        console.log(e.target)
        var unicode=e.keyCode 
        event.preventDefault(); 
        if((unicode==33)||(unicode==38)) 
        {
            previous();
        }
        else if((unicode==40)||(unicode==34))
        {
             next();
        }
    }
</script>
4

3 回答 3

1

您可以尝试使用 JQuery热键插件

让您可以轻松地在代码中的任何位置添加和删除键盘事件的处理程序,支持几乎任何组合键。

于 2013-09-26T15:09:56.493 回答
0

由于您想更改keyup事件的图像并且仅使用 javascript,因此以下代码将起作用:

document.onkeyup = function(e) {
    var image = document.getElementById('x');

    //Left Key
    if (event.keyCode == 37) {
        previous();
        //Right Key
    } else if (event.keyCode == 39) {
        next();
    }
}

每当用户抬起左或右方向键时,此代码将执行onclick您拥有的图像事件。您可以更改键码并根据需要添加更多键码。

于 2013-09-26T14:58:19.760 回答
0
function displaykey(event) {
    console.log(e.target)
    var unicode=e.keyCode 
    event.preventDefault(); 
    if((unicode==33)||(unicode==38)) {
        previous();
    } else if((unicode==40)||(unicode==34)) {
        next();
    }
}

我认为当您传入event参数然后使用e而不是event.

于 2013-09-26T15:10:32.473 回答