Question

我正在建立一个图库并且我遇到了keydown事件的错误（奇怪的是仅在Windows上，而不是在使用相同浏览器的Mac上）。

当我点击拇指时，幻灯片打开并且图像已准备就绪。我也允许图像通过箭头键滑动。奇怪的是，如果我关闭幻灯片div并重新打开它（没有任何页面刷新），如果我尝试使用键盘箭头导航它将跳过两到两个图像（1-3-5） -7等）。＆＃34;跳过号码＆＃34;我连续多次递增并再次打开幻灯片。

我用来通过键盘键浏览图像的功能与＆＃34;屏幕箭头＆＃34;相同。点击，但在第二种情况下，一切都很好。如果keydown事件有缓存或类似的事情就好了。

这是整个imgBrowsing()函数：

var imgBrowsing = function () {
    function prevNext(move) {
        /*
         * @move    { string: "prev" / "next" }
         */
        var prevCurrNext_obj = {
            'venus-img-wrap-prev':      $('.venus-img-wrap-prev'),
            'venus-img-wrap-current':   $('.venus-img-wrap-current'),
            'venus-img-wrap-next':      $('.venus-img-wrap-next')
        };

        if (move == "prev") {
            /* ***** Current img id re-definition ***** */
            (current_img_id >= 1)
                ? --current_img_id
                : current_img_id = images_length - 1;

            /* ***** PREV-CURRENT-NEXT classes re-attribution ***** */
            $.each(prevCurrNext_obj, function (class_name, jQuery_obj) {
                var b;
                (jQuery_obj.prev(venusImgWrap).length)
                    ? b = jQuery_obj.prev(venusImgWrap)
                    : b = $(venusImgWrap).last();
                b.addClass(class_name);
                jQuery_obj.removeClass(class_name);
            });
        } else if (move == "next") {
            /* ***** Current img id re-definition ***** */
            (current_img_id + 1 < images_length)
                ? ++current_img_id
                : current_img_id = 0;                           // = the first element inside the array-object 'images'
            /* ***** PREV-CURRENT-NEXT classes re-attribution ***** */
            $.each(prevCurrNext_obj, function (class_name, jQuery_obj) {
                var b;
                (jQuery_obj.next(venusImgWrap).length)
                    ? b = jQuery_obj.next(venusImgWrap)
                    : b = $(venusImgWrap).first();
                b.addClass(class_name);
                jQuery_obj.removeClass(class_name);
            });
        }

        venusDivFilling();
    }

    /* ***** KEYDOWN pression event ***** */
    $(document).on("keydown", function (e) {
        switch (e.which) {
            case 39:            // right
                prevNext("next");
                break;
            case 37:            // left
                prevNext("prev");
                break;
            case 27:            // ESC
                venusDivRemove();
                break;

            default: return;    // exits this handler for other keys
        }
        e.preventDefault();     // prevents the default action (scroll / move caret)
    });

    /* ***** ARROWS click event ***** */
    $(venusImgBrowse).click(function () {
        prevNext($(this).data('venus-direction'));
    });

    /* ***** SWIPE event ***** */
};

Answer 1

这是因为每次打开图像查看器时，keydown都会绑定到正文。

如果在图像div关闭时解除对身体的keydown，那么您将不再遇到此问题。

$("body").unbind().on("keydown")

[编辑]正如官方文档所述：自jQuery 3.0起，.unbind()已被弃用。自jQuery 1.7以来，它已被.off()方法取代，因此不鼓励使用它。

$(document).off('keydown');

Keydown开了几次

1 个答案: