Question

我已经和他一起工作了几个小时，这让我很生气。我点击链接时会弹出一个模态窗口。它有一个CSS转换，所以它渐渐消失。我需要回调一下转换完成的时间。所以我挖出了这个事件监听器：

$('#tagBox').addEventListener(
    'webkitTransitionEnd', 
    function(event) { 
        alert( "Finished transition!" ); }, 
    false );

我在Safari中，但该代码返回此错误：

TypeError: 'undefined' is not a function (evaluating '$('#tagBox').addEventListener( 'webkitTransitionEnd', function(){ alert( "Finished transition!" ) }, false )')

我的语法是否正确？我可以做alert($('#tagBox'))并返回[object]，以便找到模态元素。为什么说undefined不是函数？

感谢。

Answer 1

$（'＃tagBox'）返回一个jQuery元素，该元素没有addEventListener方法，这是一种本机方法。您需要在调用addEventListener之前获取原始DOM：

$('#tagBox')[0].addEventListener(// your code

Answer 2

应该是：

$('#tagBox').bind('webkitTransitionEnd', function() {
   //....
});

如果您只想开一次，可以使用.one：

$('#tagBox').one('webkitTransitionEnd', function() {
   //....
});

Answer 3

您是否缺少事件参数？

box.addEventListener( 
'webkitTransitionEnd', 
function( event ) { 
     alert( "Finished transition!" ); 
}, false );

Answer 4

如果您使用的是最新版本的jquery 1.7+，那么您实际上正在寻找“on” http://api.jquery.com/on/，可让您将事件添加到其中。

$('#tagBox').on('webkitTransitionEnd', function(event) { alert('whatever'); });

结合jQuery off：

$('#tagBox').on('webkitTransitionEnd', function(event) { 
    $('#tagBox').off('webkitTransitionEnd');
    alert('whatever'); 
});

Javascript事件侦听器失败，因为“undefined”不是函数

4 个答案: