css怎么去除js事件,javascript - CSS3过渡事件

我正在使用Pete给出的方法，但我现在开始使用以下方法

$(".myClass").one('transitionend webkitTransitionEnd oTransitionEnd otransitionend MSTransitionEnd',

function() {

//do something

});

或者，如果您使用bootstrap，那么您可以这样做

$(".myClass").one($.support.transition.end,

function() {

//do something

});

这是因为它们在bootstrap.js中包含以下内容

+function ($) {

'use strict';

// CSS TRANSITION SUPPORT (Shoutout: http://www.modernizr.com/)

// ============================================================

function transitionEnd() {

var el = document.createElement('bootstrap')

var transEndEventNames = {

'WebkitTransition' : 'webkitTransitionEnd',

'MozTransition' : 'transitionend',

'OTransition' : 'oTransitionEnd otransitionend',

'transition' : 'transitionend'

}

for (var name in transEndEventNames) {

if (el.style[name] !== undefined) {

return { end: transEndEventNames[name] }

}

}

return false // explicit for ie8 ( ._.)

}

$(function () {

$.support.transition = transitionEnd()

})

}(jQuery);

请注意，它们还包括一个emulateTransitionEnd函数，可能需要该函数来确保始终发生回调。

// http://blog.alexmaccaw.com/css-transitions

$.fn.emulateTransitionEnd = function (duration) {

var called = false, $el = this

$(this).one($.support.transition.end, function () { called = true })

var callback = function () { if (!called) $($el).trigger($.support.transition.end) }

setTimeout(callback, duration)

return this

}

请注意，有时此事件不会触发，通常是在这种情况下   属性未更改或未触发绘制时。 为了确保我们   总是得到一个回调，让我们设置一个触发事件的超时  手动。

[http://blog.alexmaccaw.com/css-transitions]