不能让jquery悬停与.live()一起工作

时间:2010-04-14 14:48:52

标签: jquery

第二个功能不起作用?

$('.edit_hover').live('hover',
    function(e){        
        $(this).stop();
        var half_width = ($(this).css('width').slice(0, -2))/2;
        var half_height = ($(this).css('height').slice(0, -2))*0.3;
        console.log(half_width);
        var top = ($(this).position().top) + half_height;
        var left = ($(this).position().left) + half_width;
        $('#edit_hover').css('top', top).css('left', left).fadeIn(300);
        //add overlay
        $(this).css('position', 'relative').append('<div class="edit_overlay" style="position: absolute; top:0px; left:0px; height:100%; width: 100%; background: #999; opacity: 0.5;"></div> ')
    },
    function(){
        $(this).stop();
        $(this).find('.edit_overlay').remove();
        $('#edit_hover').fadeOut(300);
    }); 

3 个答案:

答案 0 :(得分:11)

live()只需要一个处理程序,因此您无法使用hover(1.4.1之前)。无论如何,它只是mouseentermouseleave的快捷方式。使用这些事件绑定到:

$('.edit_hover')
.live('mouseenter',function(){})
.live('mouseleave',function(){}); 

或者从jQuery 1.4.1开始:

$('.edit_hover').live('hover', function(event) {
  if (event.type == 'mouseenter') {
    // first function here
  } else {
    // second function here
  }
});

答案 1 :(得分:0)

猜测:不要使用hover使用mouseovermouseout

$("...").live("mouseover", function() {
    // ....
}).live("mouseout", function() {
    // ...
});

答案 2 :(得分:0)

什么版本的jQuery?您需要使用jQuery 1.4.1来实时使用hover。早期版本不支持它。请参阅live documentation的警告部分。但请注意,您只有一个回调,需要区分回调内的事件以独立处理悬停/输出。

$('.hoverme').live('hover', function(event) {
  if (event.type == 'mouseover') {
    // do something on mouseover
  } else {
    // do something on mouseout
  }
});
相关问题