Javascript Can'；不要在Firefox的窗口上收听DOMMouseScroll

我遇到了一个与firefox的mousewheel（DOMMouseScroll）事件相关的问题。我有一个页眉div、一个内容div和一个页脚div。我希望用户能够在页眉和页脚上滚动页面，但不能在内容上滚动页面，因为它有一个地图对象（flash对象），鼠标滚轮应该放大和缩小

我正在使用jQuery1.8和Firefox15.0.1。我花了几乎一整天的时间试图弄明白这一点，在我看来，这应该是可行的：

var isFireFox = (navigator.userAgent.indexOf('Firefox') != -1); 
var scrollEv = (isFireFox)? 'DOMMouseScroll' : 'mousewheel';

$(document).on(scrollEv, HandleScroll);

function HandleScroll(e)
{
    var sender = event.srcElement;

    alert(sender.id + " has sent event: " + e.type);

    if (sender.id == "viewerContent" || sender.id == "mapObject")
    {
        alert("Event is being blocked");
        e.stopPropagation();
        e.preventDefault(); 
    }
}

我读过无数的帖子、帖子和博客，所有我读到的东西都说这应该在IE、Chrome和Firefox中都能用。当然，它在FireFox中不起作用。它甚至没有进入“HandleScroll”功能。此外，我认为甚至可以做一些更简单的事情，比如：

$('#viewerContent').on(scrollEv, false);
$('#mapObject').on(scrollEv, false);

我是否忽略了一些简单的事情

谢谢你的帮助

吉尔曼

添加：

根据法布里西奥·马特的建议，我也尝试了以下方法：

$('#viewerContent').scroll(HandleScroll);
$('#mapObject').scroll(HandleScroll);

这是：

$('#viewerContent').on('scroll', HandleScroll);
$('#mapObject').on('scroll', HandleScroll);

没用

再次添加：

jcubic建议我使用此页面上的插件：

我不太确定它是如何工作的，我是否应该简单地通过一个脚本标记将脚本包含在我的页面中，然后调用所提供链接上的示例中所示的方法之一

谢谢

进一步添加：

我让插件工作了，很简单。然而，这并不能解决我的问题。它确实适用于标准div，但似乎不适用于包含flash内容的div。我开始认为这是一个flash或firefox错误，可能在这里有详细说明：

如果有人能证实这一点，我将不胜感激

另一个不起作用的解决方案：

根据sethetter的建议，我尝试了以下方法：

var isOverContent;

$('#viewerContent').on('mouseover', function(){isOverContent = true;});
$('#viewerContent').on('mouseout', function(){isOverContent = false;});

document.onscroll = HandleScroll;

function HandleScroll(e)
{       
    if (isOverContent)
    {               
        console.log("Tried to block event");
        e.stopPropagation();  // Apparently, the "scroll" event cannot be prevented or canceled.
        e.preventDefault(); 
    }
}

---

这允许我检测用户何时在FireFox中滚动查看内容。但是，“防止默认值”和“停止传播”事件不起作用。页面一直在滚动。

根据此页面(http://bytes.com/topic/javascript/answers/160971-window-onscroll-firefox)您可以尝试window.onscroll=scrollHandler；试一试。

根据本页(http://bytes.com/topic/javascript/answers/160971-window-onscroll-firefox)您可以尝试window.onscroll=scrollHandler；试一试。

根据塞特的建议，我最后写了以下内容：

<script type="text/javascript">
  var isFireFox = (navigator.userAgent.indexOf('Firefox') != -1);   

  if (!isFireFox)
  {
      $('#viewerContent').on('mousewheel', false);
      $('#mapObject').on('mousewheel', false);
  }     
  else if (isFireFox)
  {
    var isOverContent;                                                   
    var lastPosY;

    $('#viewerContent').on('mouseover', function(){isOverContent = true;});
    $('#viewerContent').on('mouseout', function(){isOverContent = false;});

    window.onscroll = HandleScroll;
  }

  function HandleScroll(e)
  { 
    if (isOverContent)
    {                   
      $(window).scrollTop(lastPosY);    
    }
    else
    {
      lastPosY = $(window).scrollTop();
    }
  }
</script>

var isFireFox=（navigator.userAgent.indexOf（'Firefox'）！=-1）；
如果（！iFirefox）
{
$（'viewerContent'）。在（'mouseweell'，false）上；
$（'#mapObject'）。在（'mousewheel'，false）上；
}     
else if（iFirefox）
{
等高含量变种；
变位术；
$（'#viewerContent'）。on（'mouseover'，function（）{isOverContent=true；}）；
$（'#viewerContent'）。on（'mouseout'，function（）{isOverContent=false；}）；
window.onscroll=HandleScroll；
}
函数HandleScroll（e）
{ 
if（等含量）
{                   
$（窗口）.scrollTop（lastPosY）；
}
其他的
{
lastPosY=$（窗口）.scrollTop（）；
}
}

虽然不美观，但它可以在firefox和其他浏览器中使用。当在flash对象上滚动时，它确实会发出一种闪烁效果，但它会阻止用户滚动页面。此外，在firefox中，glitchy效应似乎最不明显，因此我保留了IE和Chrome的更好解决方案

既然塞特让我走上了正确的道路，我认为他的答案就是解决办法

干杯

---

吉尔曼

基于塞特特的建议，我最后写了以下内容：

<script type="text/javascript">
  var isFireFox = (navigator.userAgent.indexOf('Firefox') != -1);   

  if (!isFireFox)
  {
      $('#viewerContent').on('mousewheel', false);
      $('#mapObject').on('mousewheel', false);
  }     
  else if (isFireFox)
  {
    var isOverContent;                                                   
    var lastPosY;

    $('#viewerContent').on('mouseover', function(){isOverContent = true;});
    $('#viewerContent').on('mouseout', function(){isOverContent = false;});

    window.onscroll = HandleScroll;
  }

  function HandleScroll(e)
  { 
    if (isOverContent)
    {                   
      $(window).scrollTop(lastPosY);    
    }
    else
    {
      lastPosY = $(window).scrollTop();
    }
  }
</script>

var isFireFox=（navigator.userAgent.indexOf（'Firefox'）！=-1）；
如果（！iFirefox）
{
$（'viewerContent'）。在（'mouseweell'，false）上；
$（'#mapObject'）。在（'mousewheel'，false）上；
}     
else if（iFirefox）
{
等高含量变种；
变位术；
$（'#viewerContent'）。on（'mouseover'，function（）{isOverContent=true；}）；
$（'#viewerContent'）。on（'mouseout'，function（）{isOverContent=false；}）；
window.onscroll=HandleScroll；
}
函数HandleScroll（e）
{ 
if（等含量）
{                   
$（窗口）.scrollTop（lastPosY）；
}
其他的
{
lastPosY=$（窗口）.scrollTop（）；
}
}

虽然不美观，但它可以在firefox和其他浏览器中使用。当在flash对象上滚动时，它确实会发出一种闪烁效果，但它会阻止用户滚动页面。此外，在firefox中，glitchy效应似乎最不明显，因此我保留了IE和Chrome的更好解决方案

既然塞特让我走上了正确的道路，我认为他的答案就是解决办法

干杯

吉尔曼

我发现一个解决办法是有效的

通过以下代码进行检查：

$(document).bind("mousewheel DOMMouseScroll", function (e) {
            e.stopImmediatePropagation();
            e.stopPropagation();
            e.preventDefault();

            var delta = parseInt(e.originalEvent.wheelDelta || -e.originalEvent.detail);

            alert(delta);
            return false;
        });

祝你好运。

我发现一个解决办法奏效了

通过以下代码进行检查：

$(document).bind("mousewheel DOMMouseScroll", function (e) {
            e.stopImmediatePropagation();
            e.stopPropagation();
            e.preventDefault();

            var delta = parseInt(e.originalEvent.wheelDelta || -e.originalEvent.detail);

            alert(delta);
            return false;
        });

---

祝你好运。

只是看到一个类似的问题并使用

onwheel

而不是

onDomMouseScroll

---

可以解决我的问题

只是看到一个类似的问题并使用

onwheel

而不是

onDomMouseScroll

---

可以解决我的问题

您是否尝试过

$（'#viewerContent'）。在（'scroll'，handler）

/

$（'#viewerContent'）。滚动（handler）

？当然，如果你真的想取消滚动事件，那对用户来说很烦人，但是

e.preventDefault（）

理论上应该是可行的。只是尝试了一下，没有成功。警报不会弹出。对于这样的事件，请尝试不发出警报，而是使用console.log之类的工具或将某些内容附加到输出div中进行测试。是的，当它工作时确实会让人恼火！关于console.log的好提示。但仍然需要一个解决方案！鼠标事件只会在Flash环境本身中触发，而不会返回到浏览器，这显然取决于浏览器。有时，您可以通过将flash wmode参数更改为

不透明

来避免这种情况。这意味着