1

鉴于下面显示的以下 html 表和脚本,我遇到了鼠标离开事件似乎在鼠标进入后立即触发的问题,即使我没有将鼠标移出行。

<script type="text/javascript" language="javascript">
    function highlightRows(iMainID) 
    {
        $('tr[mainid=' + iMainID+ ']').each(function() {
            if ($(this).attr('old') == undefined) {
                $(this).attr('old', $(this).css('backgroundColor'));
            }
            $(this).animate({ backgroundColor: "#FFFFCC" }, 500);
            $(this).mouseout(function() {
                if ($(this).attr('old') != undefined) {
                    $(this).animate({ backgroundColor: $(this).attr('old') }, 500);
                }
            });
        });        
    }
</script>
<table>
    <tr> 
      <td mainid="1" onmouseover='highlightRows(1)'><div>text</div></td>
      <td mainid="1" onmouseover='highlightRows(1)'><div>text</div></td>      
      <td mainid="2" onmouseover='highlightRows(2)'><div>text</div></td>
    </tr>
<table>
4

4 回答 4

3

正如 Pointy 和 Jer 都指出的那样,您应该选择一种模型(JQuery)或另一种(HTML 中的 onWhatever),不要混合使用它们。

最有可能的是,您的重复条目与您多次订阅同一事件的事实有关。(如果您执行鼠标悬停两次,您将获得两个都将被调用的 mouseout 事件处理程序。)

此外,请注意重复的“mainid”值。这看起来像一个问题,并且可能是您的问题的原因。

于 2010-03-08T19:08:23.683 回答
1

做到这一点的 jquery 方法是只使用hover,设置在一个$(document).ready函数中,就像@pointy 说的一样放弃onmouseover所有

$(document).ready(function(){
    $('tr').hover(function() {
       if ($(this).attr('old') == undefined) {
          (this).attr('old', $(this).css('backgroundColor'));
       }
       $(this).animate({ backgroundColor: "#FFFFCC" }, 500);
    }, function() {
       if ($(this).attr('old') != undefined) {
           $(this).animate({ backgroundColor: $(this).attr('old') }, 500);
       }
    });
});
于 2010-03-08T19:09:08.803 回答
1

为什么不使用.hover?

$('tr[mainid=' + iMainID+ ']').hover(
        function()
        {
            $(this).addClass('hoverClass');
        },
        function()
        {
            $(this).removeClass('hoverClass');
        }
    );
于 2010-03-08T19:10:01.047 回答
0

你可能想做这样的事情:

function yourMouseOver(){...}
function yourMouseOut(){...}

和:

<td onmouseover="yourMouseOver()" onmouseout="yourMouseOut()">html</td>

onmouseout每次触发事件时设置onmouseover事件是多余的。

于 2010-03-08T19:03:32.510 回答