鉴于下面显示的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>
答案 0 :(得分:3)
正如Pointy和Jer都指出的那样,你应该选择一个模型(JQuery)或另一个模型(在HTML中的任何内容),不要混用它们。
最有可能的是,您的双重录入与您多次订阅同一事件的事实有关。 (如果你进行两次鼠标悬停,你会得到两个将被调用的mouseout事件处理程序。)
另外,请注意重复的“mainid”值。这看起来像是一个问题,可能是您问题的原因。
答案 1 :(得分: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);
}
});
});
答案 2 :(得分:1)
为什么不使用.hover?
$('tr[mainid=' + iMainID+ ']').hover(
function()
{
$(this).addClass('hoverClass');
},
function()
{
$(this).removeClass('hoverClass');
}
);
答案 3 :(得分:0)
你可能想做这样的事情:
function yourMouseOver(){...}
function yourMouseOut(){...}
使用:
<td onmouseover="yourMouseOver()" onmouseout="yourMouseOut()">html</td>
每次触发onmouseout
事件时设置onmouseover
事件都是多余的。