event.preventDefault(); फ़ायरफ़ॉक्स में mousewheel को रोक नहीं

Question

मैं एक div की संख्या बढ़ाने के लिए jquery में mousewheel का उपयोग कर रहा हूँ, संख्या सही ढंग से बढ़ जाती है लेकिन स्क्रॉल फ़ायरफ़ॉक्स में बंद नहीं है।

$(document).ready(function(){ 

    $('#test').bind('mousewheel DOMMouseScroll', function(event){ 

     var currentValue = parseInt($('#test').text(),10), 
      newValue = currentValue + 1; 

     $('#test').text(newValue);  
     event.preventDefault(); 
    }); 
}); 

फिडल: http://jsfiddle.net/rHVUn/

बेला मानक माउसव्हील का पता लगाने का उपयोग करता है, लेकिन मैं यह भी ब्रैंडन हारून के माउसव्हील प्लगइन का इस्तेमाल किया है और यह एक ही समस्या है।

div को अद्यतन करने वाली रेखा को हटाने से मैंने समस्या को हल किया है, लेकिन यह समस्या का समाधान करता है, लेकिन यह कोड का एक महत्वपूर्ण हिस्सा है और इसे हटाया नहीं जा सकता है।

क्या कोई इस मुद्दे को हल करने का तरीका जानता है?

धन्यवाद

अद्यतन: मैं पाया है जब मेरे माउस अगर मेरे माउस बॉक्स के अंदर है, लेकिन पाठ के ऊपर नहीं (गद्दी के अंदर) के स्क्रॉल, पाठ के ऊपर सीधे स्थिति में है समस्या केवल तब होता है

Answer 1

मैं अपने समस्या का समाधान मिल गया है, यह ऐसा करने के लिए सबसे अच्छा तरीका नहीं हो सकता है काम करने के लिए लगता है, लेकिन यह काम करता हैं।

मुझे पता चला कि समस्या तब होती है जब मेरा माउस सीधे स्क्रॉल के दौरान पाठ पर स्थित होता है, इसलिए मैंने ओवरलेइंग तत्व जोड़ा और इसे मूसहेल ट्रिगर के रूप में उपयोग किया।

फिडल: http://jsfiddle.net/rHVUn/9/
(पृष्ठभूमि रंग की जरूरत नहीं है) के बजाय

Answer 2

क्या आपने अपनी जगह के बजाय 'mousewheel' ईवेंट को बांधने की कोशिश की है? :

$('#test').bind('mousewheel', function(event){ ... 

मैं अपने बेला अनुकूलित और यह

Answer 3

कोशिश इस

$(document).ready(function(){ 

    $('#test').bind('mousewheel DOMMouseScroll', function(event){ 

     var currentValue = parseInt($('#test').text(),10), 
      newValue = currentValue + 1; 

     $('#test').text(newValue);  
     return false; 
    }); 
}); 

Answer 4

$('#objectId').on({ 
      'mousewheel': function(e) {     
       e.preventDefault(); 
       e.stopPropagation(); 
       } 
      }) 

उपयोग इस है, जो मुझे

Answer 5

लिए काम करता है यह क्रोम, फ़ायरफ़ॉक्स lattest संस्करणों और IE पर ठीक काम करता है, Try this:

document.onmousewheel = function(){ stopWheel(); } /* IE7, IE8 */ 
 
if(document.addEventListener){ /* Chrome, Safari, Firefox */ 
 
    document.addEventListener('DOMMouseScroll', stopWheel, false); 
 
} 
 
    
 
function stopWheel(e){ 
 
    if(!e){ e = window.event; } /* IE7, IE8, Chrome, Safari */ 
 
    if(e.preventDefault) { e.preventDefault(); } /* Chrome, Safari, Firefox */ 
 
    e.returnValue = false; /* IE7, IE8 */ 
 
}

div { 
 
    float:left; 
 
    width:25px; 
 
    height:25px;; 
 
    text-align:center; 
 
    margin:5px; 
 
    padding:5px; 
 
    border:1px solid #bbb; 
 
} 
 
#test_ov { 
 
    position:absolute; 
 
    background:rgba(45,65,40,0.3); 
 
}

<div style="height:900px; border:0;"> 
 
    <div id="test">0</div> 
 
    <span id="test_ov"></span> 
 
</div>

Answer 6

स्क्रॉल ईवेंट को रोकने के बावजूद फ़ायरफ़ॉक्स स्क्रॉलिंग के मुद्दे की खोज करते समय यह शीर्ष पोस्टों में से एक है।

फ़ायरफ़ॉक्स माउस स्क्रॉल पर दो घटनाओं को ट्रिगर करता है: DOMMouseScroll और MozMousePixelScroll। https://github.com/jquery/jquery-mousewheel/issues/45#issuecomment-11749359 देखें MozMousePixelScroll ईवेंट को रोकने के लिए आवश्यक है।

https://developer.mozilla.org/en-US/docs/Web/Events/MozMousePixelScroll के अनुसार सबसे आधुनिक घटना का नाम wheel है, जो फ़ायरफ़ॉक्स (55) और क्रोम (61) के मेरे संस्करण के साथ काम करता प्रतीत होता है। शायद यही वह है जो आपको उपयोग करना चाहिए।देखें https://developer.mozilla.org/en-US/docs/Web/API/WheelEvent/WheelEvent

यहाँ एक JSFiddle है:

https://jsfiddle.net/ahpy9f66/