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 コンソールをチェックして、「起動」がログに記録されている回数を確認します。

于 2013-06-11T10:01:43.623 に答える