Question

您好，

首次渲染页面时，我的div元素如下所示：

<div onmousedown="this.className='showhideExtra_down_click';"
   onmouseout="this.className='showhideExtra_down';"
   onmouseover="this.className='showhideExtra_down_hover';"
   class="showhideExtra_down" id="extraFilterDropDownButton">&nbsp;</div>

然后我用javascript手动更新onmouse属性，所以看起来像这样：

<div onmousedown="this.className='showhideExtra_down_click';"
   onmouseout="this.className='showhideExtra_down';"
   onmouseover="this.className='showhideExtra_down_hover';"
   class="showhideExtra_down" id="extraFilterDropDownButton">&nbsp;</div>

它们看起来一样，最大的区别是第一个会在徘徊时改变类而第二个不会？页面渲染后是否无法设置？

请注意：我需要 IE6兼容性，这就是为什么我使用onmouse而不是CSS hover

BestRegards

编辑：这是我发现的，并且工作很好，我还没有在IE6中测试过它：

$("#extraFilterButton").hover(function() {
                $(this).attr('class','showhideExtra_down_hover');
            }, 
            function() {
                $(this).attr('class','showhideExtra_down');
            });

Answer 1

你可以使用：

$('#selector').live('mouseover',function(){//something todo when mouse over})

live（）允许动态更改

（'mouseout'也可以这样做）

Answer 2

要扩展@ maniator的正确答案，我会使用：

$("#some_id").live("hover",
  function() {
    // do on mouseover
  },
  function() {
    // do on mouseout
  });

Answer 3

这就是我最终的结果：

    $("#extraFilterDropDownButton").hover(function() {
        if($('#divCategoryFilter').css("display") == 'block'){
            $(this).attr('class','showhideExtra_up_hover');
        }
        else{
            $(this).attr('class','showhideExtra_down_hover');
        }
    }, 
    function() {

        if($('#divCategoryFilter').css("display") == 'block'){
            $(this).attr('class','showhideExtra_up');
        }
        else{
            $(this).attr('class','showhideExtra_down');
        }
    });

然而，这在IE6中尚未经过测试。

在页面呈现后附加onmouseover？

3 个答案: