请查看steven.tlvweb.com

我想实现它,以便左右键盘箭头控制流程。

当前,滚轮可以正常工作并在构造函数中进行如下设置:

/*  ImageFlow Constructor */

    /* add mouse wheel events ==== */
    if (window.addEventListener)
        this.oc.addEventListener('DOMMouseScroll', function(e) {
            if (e.preventDefault) e.preventDefault();
            this.parent.scroll(-e.detail);
            return false;
        }, false);

    this.oc.onmousewheel = function () {
        this.parent.scroll(event.wheelDelta);
        return false;
    }


在imageflow.prototype中,代码如下:

    /* ==== mousewheel scrolling ==== */
    scroll : function (sc) {
        if (sc < 0) {
            if (this.view < this.NF - 1) this.calc(1);
        } else {
            if (this.view > 0) this.calc(-1);
        }
    },


因此,我为构造函数编写了一些代码:

this.oc.onkeydown=function(){
        this.parent.keypress(event.keyCode);
        return false;
    }


在imageflow.prototype中,我包括:

    /* ==== arrow keys ==== */
    keypress : function(kp) {
        switch (kp) {

        case 39:                        //right Key
        if (this.view < this.NF - 1) {  //if not at far right of gallery
                    this.calc(1);       //move gallery left
        break;
                    }

                    case 37:            //left Key
        if (this.view > 0) {            //if not at far left of gallery
                    this.calc(-1);      //move gallery left
        break;
                    }

        }
    },


注意:实际上,当前在imageflow构造函数中有代码,但是它不起作用(将它们全部删除甚至无效):

    /* ==== right arrow ==== */
    this.arR.onclick = this.arR.ondblclick = function () {
        if (this.parent.view < this.parent.NF - 1)
            this.parent.calc(1);
    }
    /* ==== Left arrow ==== */
    this.arL.onclick = this.arL.ondblclick = function () {
        if (this.parent.view > 0)
            this.parent.calc(-1);
    }


我认为我缺少相对基本的东西。

最佳答案

我在JSFiddle中为您创建了一个更简单的示例。

http://jsfiddle.net/nLaGz/

基本上,您似乎正在尝试将键盘事件附加到this.oc对象,该对象基本上表示您的<div id="imageFlow">元素。

问题是<div>元素不是输入元素,因此它们在键盘事件中的表现不佳,因为它们从未像窗体输入那样真正获得“焦点”。

幸运的是,window.document对象是附加键盘事件的好地方,因为无论dom元素具有什么焦点,它都将侦听。

尝试更改您的行:

this.oc.onkeydown




window.document.onkeydown

关于javascript - 如何使用Javascript onKeyDown来控制图库-左右箭头,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/13828570/

10-11 05:36