0

我正在使用以下 jQuery 脚本来添加“点击”支持。

(function($) {
    $.event.special.tap = {
        setup: function(data, namespaces) {
            var $elem = $(this);
            $elem.bind('touchstart', $.event.special.tap.handler)
                 .bind('touchmove', $.event.special.tap.handler)
                 .bind('touchend', $.event.special.tap.handler);
        },

        teardown: function(namespaces) {
            var $elem = $(this);
            $elem.unbind('touchstart', $.event.special.tap.handler)
                 .unbind('touchmove', $.event.special.tap.handler)
                 .unbind('touchend', $.event.special.tap.handler);
        },

        handler: function(event) {
            event.preventDefault();
            var $elem = $(this);
            $elem.data(event.type, 1);
            if (event.type === 'touchend' && !$elem.data('touchmove')) {
                // set event type to "tap"
                event.type = 'tap';
                // let $ handle the triggering of "tap" event handlers
                $.event.handle.apply(this, arguments);
            } else if ($elem.data('touchend')) {
                // reset our data attributes because our event is over
                $elem.removeData('touchstart touchmove touchend');
            }
        }
    };
})(jQuery);

然后我有以下添加/删除一个类:

$('#thumb-tray-trigger').on('tap',function () {
    tap();
}); 

function tap() {
    $('#thumb-tray').toggleClass(function() {
        if ($(this).is('.close-tray')) {
            $(this).addClass('open-tray');
            $(this).removeClass('close-tray');
        } else {
           $(this).removeClass('open-tray');
           $(this).addClass('close-tray');      
        }
    });
} 

我不明白为什么点击手势只在第一次起作用。任何后续的点击都不会做任何事情。

知道是什么原因造成的吗?

4

1 回答 1

1

试试这个以确保它只被触发一次:

$('#thumb-tray-trigger').on('tap',function () {
    tap();
}); 

function tap() {
    console.log("fired");
    $('#thumb-tray').toggleClass(function() {
        if ($(this).is('.close-tray')) {
            $(this).addClass('open-tray');
            $(this).removeClass('close-tray');
        } else {
           $(this).removeClass('open-tray');
           $(this).addClass('close-tray');      
        }
    });
}

然后检查 javascript/dev 控制台并查看记录了多少次“fired”

于 2013-06-11T10:01:43.623 回答