JavaScript 脚本在 Firefox 中不起作用答案

【问题标题】：JavaScript script doesn't work in FirefoxJavaScript 脚本在 Firefox 中不起作用
【发布时间】：2011-05-11 03:22:43
【问题描述】：

我有一个旧函数缺少 Mozilla/Firefox 的行，因此 JavaScript 无法在其中正常工作。该函数跟踪鼠标坐标，以便我可以定位窗口。

如何让代码也能在 Firefox 中运行？

Xoffset = -60; // modify these values to ...
Yoffset = 20; // change the popup position.
var old, skn, iex = (document.all),
    yyy = -1000;

var ns4 = document.layers
var ns6 = document.getElementById && !document.all
var ie4 = document.all

if (ns4) skn = document.dek
else if (ns6) skn = document.getElementById("dek").style
else if (ie4) skn = document.all.dek.style
if (ns4) document.captureEvents(Event.MOUSEMOVE);
else {
  skn.visibility = "visible"
  skn.display = "none"
}
document.onmousemove = get_mouse;


function popup(msg, bak) {
  var content = 
      "<TABLE  WIDTH=150 BORDER=1 BORDERCOLOR=black CELLPADDING=2" +
      "CELLSPACING=0 " + "BGCOLOR=" + bak + "><TD ALIGN=center>" + 
      "<FONT COLOR=black SIZE=2>" + msg + "</FONT></TD></TABLE>";
  yyy = Yoffset;
  if (ns4) {
    skn.document.write(content);
    skn.document.close();
    skn.visibility = "visible"
  }
  if (ns6) {
    document.getElementById("dek").innerHTML = content;
    skn.display = ''
  }
  if (ie4) {
    document.all("dek").innerHTML = content;
    skn.display = ''
  }
}

function get_mouse(e) {
  var x = (ns4 || ns6) ? event.pageX : event.x + document.body.scrollLeft;
  skn.left = x + Xoffset;
  var y = (ns4 || ns6) ? event.pageY : event.y + document.body.scrollTop;
  if (document.documentElement &&  // IE6 +4.01 but no scrolling going on
     !document.documentElement.scrollTop) {
    y = event.y + document.documentElement.scrollTop;
  }
  else if (document.documentElement && // IE6 +4.01 and user has scrolled
           document.documentElement.scrollTop) { 
    y = event.y + document.documentElement.scrollTop;
  }
  else if (document.body && document.body.scrollTop) { // IE5 or DTD 3.2
    y = event.y + document.document.body.scrollTop;
  }

  skn.top = y + yyy;
}

function kill() {
  yyy = -1000;
  if (ns4) {
    skn.visibility = "hidden";
  }
  else if (ns6 || ie4) skn.display = "none"
}

我收到此错误：

“事件未定义”

在 IE 中工作正常。

【问题讨论】：

说真的，使用 jQuery。它将所有关于不同浏览器界面的废话抽象为合理的东西。
看起来您在get_mouse 方法签名中将event 变量定义为e。
+1 用于 jQuery。除此之外，NS已经死了。特别是 NS4...
问题是你的条件。您似乎正在测试 ns4 或 ns6，如果评估结果为 false，它将尝试计算 event.x。 Firefox 在 ns4 或 ns6 中不符合条件，也不支持 event.x。您需要在 (ns4 || ns6) 条件中添加一个 firefox 测试，因为它也使用 e.pageX
@Codex73 我不会测试浏览器，而是测试对象/属性是否存在。例如：“var x = e.pageX ? e.pageX : e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;” - 我认为可能有更简单的方法可以做到这一点，例如“var x = e.pageX || e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;”但我不确定这会奏效。测试一下，看看你会得到什么。另外，有关更多详细信息，请查看：quirksmode.org/js/events_properties.html

标签： javascript firefox dom javascript-events

【解决方案1】：

我不会发布有关如何重写代码的代码 @Ivo Wetzel's 几乎是您所需要的，但让 meg 给您一些建议。

世界瞬息万变，计算机行业也是如此。虽然有时它没有我们想要的那么快（IE 6 逐渐淡出），但没有必要支持 Netscape 4。
咨询类似 StatCounter 的网站，了解正在使用的浏览器（在您的国家/地区）。另请咨询 YUI graded browser support。雅虎是互联网上最大的玩家之一，他们的网站必须为几乎所有人服务，所以他们知道自己在说什么。
找到一个好的 DOM 引用。 MDC 几乎是您所需要的，但是对于 IE 怪癖来说，拥有 MSDN 是件好事。说到怪癖，别忘了收藏QuirksMode compatibility tables。
永远不要使用ie4 = document.all 之类的东西，因为单个功能无法识别整个浏览器。这就像在说：“嘿，你有一头金发，你一定是布拉德皮特”。使用特征检测。阅读这两篇优秀的文章：Browser Detection (and What to Do Instead)和Feature Detection: State of the Art Browser Scripting
不要使用document.write，因为它是同步 I/O，这很糟糕。它会阻止您的页面呈现并导致糟糕的用户体验。网络就是asynchronous。

“同步编程是不尊重人的，不应在人们使用的应用程序中使用。” - 道格拉斯·克罗克福德

【讨论】：

非常好，简洁明了。我很欣赏诚实的答案和方向。很棒的评论！至少我没有写这段代码！！再次感谢@galambalazs

【解决方案2】：

天啊...这一定是我多年来见过的最糟糕的代码，那么让我们试着清理一下吧：

Xoffset = -60; // modify these values to ...
Yoffset = 20; // change the popup position.
var old, skn = document.getElementById("dek").style, yyy = -1000;

function popup(msg, bak) {
    var content = 
        "<TABLE  WIDTH=150 BORDER=1 BORDERCOLOR=black CELLPADDING=2" +
        "CELLSPACING=0 " + "BGCOLOR=" + bak + "><TD ALIGN=center>" + 
        "<FONT COLOR=black SIZE=2>" + msg + "</FONT></TD></TABLE>";

    yyy = Yoffset;
    document.getElementById("dek").innerHTML = content;
    skn.display = '';
}

document.onmousemove = function(e) {
    e = e || window.event;

    var x = e.pageX !== undefined ? e.pageX : e.clientX + document.body.scrollLeft;
    var y = e.pageY !== undefined ? e.pageY : e.clientY + document.body.scrollTop;
    skn.left = x + Xoffset;
    skn.top = y + yyy;
}

function kill() {
  yyy = -1000;
  skn.display = "none";
}

它仍然坏得无法修复，但它应该工作...不知何故....好吧，除非您将其余部分发布为 HTML，否则我无法对此进行测试。

拜托，我求求你...摆脱所有这些废话并使用 jQuery。

【讨论】：

【解决方案3】：

我不会测试浏览器，而是测试对象/属性是否存在。例如：

var x = e.pageX ? e.pageX : e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;

我认为可能有更简单的方法可以做到这一点，例如

var x = e.pageX || e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;

但我不确定这是否可行。测试一下，看看你会得到什么。另外，欲了解更多详情，请查看：quirksmode.org/js/events_properties.html

还请注意，我将“event”更改为“e”，因为您传递给函数的参数是“e”。如果还想用event，把参数改写为：

function get_mouse(event)

虽然我不认为“event”是 JS 的保留字，但很多浏览器都使用它，所以我建议坚持使用“e”。

【讨论】：

【解决方案4】：

看来您需要将所有 'event' 实例更改为 'e'。

【讨论】：

不完全正确，仅调用“事件”是因为他的条件不正确。 Firefox 不支持通过三元分配的“e.x”。他需要在他的 (ns4 || ns6) 条件中添加一个对 Firefox 的测试。这让我觉得这段代码很旧......此时可能应该从头开始重做。
是的，这只是第一个建议，因为没有事件声明，只有函数中的 e。它需要更多的工作才能让它在 FF 中工作。

【解决方案5】：

Firefox 包括 document.documentElement 和 document.documentElement.scrollTop 和 document.body 和 document.body.scrollTop，因此您正在输入适用于 IE 和 Firefox 的区域。

你也应该用类似的东西开始你的功能

function get_mouse(e) {
    e = e || window.event;

然后在你使用event的所有地方使用e而不是event。

【讨论】：

【解决方案6】：

在函数体第一行加var event = e，怕麻烦的话 function get_mouse(e) { var event = e;

【讨论】：