0 
<input type="text" id="sShState" />
$('#sShState').liveSearch(); // A plug-in
// inside plug-in:
$this = $(this);

// On focus I add a dropdown box and add li's;

var obj = '<ul id="ddList"></ul>';
$this.after(obj);
$this.next('ul').html(li's);

$('#ddList').live('mouseenter', function(){
    var $li = $this.next('ul').children('li');
    $li.removeClass('hoverLi');
    $li.hover(function(e){
        $li.filter('[last]').removeAttr('last');
        $(this).addClass('hoverLi');
    },function() {
        $li.filter('.hoverLi').attr('last', true);
        $li.filter('.hoverLi').removeClass('hoverLi');
    });

    $li.click(function(){
        selectLi($(this));
        removeList ();
    });
});

在 Chrome 中它非常非常快！

但是在 Firefox 中，当鼠标第一次进入 ulbox 时，它需要 1-2 秒才能开始执行代码。

即使在 Internet Explorer 7 中也能正常工作。悬停的 li 稍微落后了一点，但是当鼠标进入 ul 框时它立即开始执行。

4

1 回答 1

2

您似乎在另一个事件内有事件分配代码。因此，每当“mouseenter”事件发生时，它都会重新分配“悬停”和“点击”事件。您应该在 live() 函数之外附加这些事件。

我不知道你的页面结构，所以这可能不完全正确。但它确实说明了问题。

$('#ddList').live('mouseenter', function(){ 
    var $li = $this.next('ul').children('li'); 
    $li.removeClass('hoverLi');         
});

$('#ddList li').hover(function(e){  
      // $(this).filter('[last]').removeAttr('last');
      $(this).addClass('hoverLi');
},function() { 
      // $(this).filter('.hoverLi').attr('last', true);
      $(this).filter('.hoverLi').removeClass('hoverLi');
});

$('#ddList li').click(function(){
      selectLi($(this));  removeList ();      
});

我不完全确定您的代码中发生了什么，但如果您的意图是确保事件附加到动态创建的“li”元素，那么您需要像使用“mouseenter”一样使用 .live() .

$('#ddList li').live('mouseover', function() {...

$('#ddList li').live('mouseout', function() {...

$('#ddList li').live('click', function() {...

编辑：click() 与 live() 的解释

如果我有一个<div id='mydiv'></div>HTML，那么我需要做的就是分配以下内容来附加点击事件：

$('#mydiv').click(function() {
    // whatever I want to do on click
});

但是如果div动态添加到 DOM 中，那么我可以使用 live() 代替，并且每当我动态添加元素时，jQuery 都会自动分配一个事件。

$('#mydiv').live('click', function() {
    // whatever I want to do on click
    // jQuery takes care of assigning it to mydiv when dynamically added to DOM
});
于 2010-02-06T20:13:03.517 回答