Question

我只有data-next，data-prev，data-cat attr。

到目前为止，这是js ..

$(document).keydown(function(event) {

    var prev = $("#myDiv").attr('data-prev'),
        cat = $("#myDiv").attr('data-cat'),
        next = $("#myDiv").attr('data-next');

    switch (event.keyCode) {

        case 37:
            if (prev >= 1) {
                window.location = "http://site.com/picture/" + prev;
            }
            break;

        case 39:
            if (next > 1) {
                window.location = "http://site.com/picture/" + next;
            }
            break;
    }
});

代码正在运行，但仅适用于左和右操作。对于猫我认为这样做，但我认为是错误的，有更好的方法来做到这一点！

$(document).keydown(function(event) {

    var prev = $("#myDiv").attr('data-prev'),
        cat = $("#myDiv").attr('data-cat'),
        next = $("#myDiv").attr('data-next');

    if (cat) {
        switch (event.keyCode) {

        case 37:
            if (prev >= 1) {
                window.location = "http://site.com/picture/" + prev;
            }
            break;
        case 39:
            if (next > 1) {
                window.location = "http://site.com/picture/" + next;
            }
            break;

        }
    }
    else {
        switch (event.keyCode) {
            // but i dont how to insert the cat var the link have to be cat/{n}/picture/{n}
        case 37:
            if (prev >= 1) {
                window.location = "http://site.com/picture/" + prev;
            }
            break;
        case 39:
            if (next > 1) {
                window.location = "http://site.com/picture/" + next;
            }
            break;

        }
    }
});

Answer 1

（评论中有很多解释）

所以，我想知道你为什么使用window.location：它会对页面进行无用的刷新。

我制作了一个非常基本的小脚本，它改变了按键上的img src。您可能需要调整它（我使用来自placekitten.com的猫），但我会保留您的图像编号。我试着让它简单易懂。

http://jsfiddle.net/teVPD/11/

可以添加许多功能（动画，猫预加载），但这是增强汽车滑块的良好开端。

看看，如果您有任何疑问，请不要犹豫，问一下。

用猫改变图片的左右keydown事件

1 个答案: