鼠标悬停时未定义的 ParentNode DOM 错误
怎么样,
[这里有一个小页面说明了我的问题](问题出现在 Firefox 中)
所以我有一个函数 onmouseout="regress(event, this)"
来测试鼠标是否实际上在当前元素及其任何子元素之外。 (有关我这样做的原因以及问题所在的更多详细信息)。 如果鼠标确实在外面,我想停止按钮上的动画并重置计时器(我就是这么做的)。它有效。
只是事实并非如此。在 Firefox(测试 v5.0)中就是这样。我收到与 DOM 相关的错误。触发该函数的元素的 parentNode
是“”,然后它的父节点将是“未定义”,然后我收到错误并且代码爆炸。
这是令人困惑的部分:只有当鼠标真正离开按钮区域时才会出现此错误。还有另一种情况,当 onmouseout 事件被触发时(为了避免这种情况,我使用了这个函数)。这是 onmouseout 将按钮的一个子按钮移至按钮的另一个子按钮。在这种情况下,parentNode
工作正常,从buttonChild 到button 到buttonParent 到blabla 到BODY,然后停止。
我的问题是,为什么未定义的错误在一种情况下出现,而在另一种情况下却没有。请注意,Chrome 或 IE9 中没有错误。另外我该如何修复它?
这让我很困惑。感谢您的帮助。
我很困惑。
这里还有 javascript 函数:
function regress(evt, x){
//if (!e && window.event)
if (window.event)
var e = window.event;
else
var e = evt; //if we got here, you're using Firefox
var reltg = (e.relatedTarget) ? e.relatedTarget : e.toElement;
while (reltg.tagName != 'body')
{
//alert(reltg.id+" == " + x.id);
if (reltg.id == x.id)
{
return;
}
reltg = reltg.parentNode;
//alert(reltg.tagName);
}
// I'm on true mouseout, do stuff here:
$("#"+x.id+"ThickParent").stop(true, false);
$("#"+x.id+"ThickParent").width(0);
canStartAgain=true;
stopInterval = true;
timerValue = 1.50;
$("#"+x.id+"Timer").html("");
//thanks to: http://www.webmasterworld.com/javascript/3752159.htm
}
取消注释 //alert(reltg.id+" == " + x.id);
以准确查看 onmouseout
何时被触发以及哪个元素 < code>reltg.parentNode 在什么时间开启。
How's it,
[here is a small page illustrating my problem] (problem appears in Firefox)
So I have a function onmouseout="regress(event, this)"
which tests if the mouse actually got outside the current element and any of it's children. (more details on why I did this and what is the matter).
If the mouse is truly outside, I want to stop the animation on the button and reset a timer (which I did). And it works.
Only it doesn't. In Firefox (tested v5.0) that is. I get a DOM related error. parentNode
of the element that triggered the function is "" and then the parent of that will be "undefined" and then I get an error and the code explodes.
Here's the baffling part: This error occurs only when the mouse truly goes off the button area. There's another case when the onmouseout event gets triggered (for the avoidance of which I'm using this function). Which is onmouseout off a child of the button to another child of the button. In this case, the parentNode
works fine, going from buttonChild to button to buttonParent to blabla to BODY and then stops.
My question is, why does the undefined error appear in one case and doesn't in the other. Mind you that there are no errors in Chrome or IE9. Also how can I fix it?
This baffles me. Thank you for any help.
I am baffled.
Also here is the javascript function:
function regress(evt, x){
//if (!e && window.event)
if (window.event)
var e = window.event;
else
var e = evt; //if we got here, you're using Firefox
var reltg = (e.relatedTarget) ? e.relatedTarget : e.toElement;
while (reltg.tagName != 'body')
{
//alert(reltg.id+" == " + x.id);
if (reltg.id == x.id)
{
return;
}
reltg = reltg.parentNode;
//alert(reltg.tagName);
}
// I'm on true mouseout, do stuff here:
$("#"+x.id+"ThickParent").stop(true, false);
$("#"+x.id+"ThickParent").width(0);
canStartAgain=true;
stopInterval = true;
timerValue = 1.50;
$("#"+x.id+"Timer").html("");
//thanks to: http://www.webmasterworld.com/javascript/3752159.htm
}
Uncomment //alert(reltg.id+" == " + x.id);
to see exactly when onmouseout
got triggered and what element reltg.parentNode
is on at what time.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
几个月前我也遇到了同样的问题。您会注意到从顶部退出不会发生错误。由于某种原因,“body”标签被缩小以适合内部 div 并延伸到顶部,当移动到底部(或左、右)时,FF 会触发事件,相关目标指向“html”标签并在你的循环的停止条件是标签是“body”标签。 “html”标签的父级是文档,文档的父级是
null
,当您尝试访问null< 的
tagName
属性时,会抛出错误/代码>。要达到预期结果,您必须将停止条件更改为while (reltg.tagName != 'html')
或什至将错误恢复能力最强的while (reltg && (reltg. tagName != 'body'))
。I got this same problem a few months ago. You will notice that exiting by the top side the error don't happen. By some reason the "body" tag is narrowed to fit the the inner div and extended to the top and when moving to botton(or leff, or right) FF triggers the event with a related target pointing to the "html" tag and in your loop the stop condition is the tag being the "body" one. The parent of the "html" tag is the document and the document's parent is
null
and the error is throw when you try to access thetagName
property ofnull
. To achieve the expected result you must change your stop condition towhile (reltg.tagName != 'html')
or even a most error resilient aswhile (reltg && (reltg.tagName != 'body'))
.