होवर पर Jquery

Question

मैं jQuery कोड 1.8 के साथ संगत होने के लिए अपने कोड बदल रहा हूं और मैं इस hover से फंस गया हूं जो काम नहीं करता है। जब मैंने click के साथ एक ही चीज़ का उपयोग किया तो यह काम करता था। यहां मेरा कोड है, क्या कोई मुझे बता सकता है कि मैं गलत कहां जा रहा हूं? http://api.jquery.com/on/

आप अपने संचालकों को गतिशील रूप में अच्छी तरह तत्व जोड़े के लिए बाध्य किया जा की जरूरत नहीं है, तो आप 2 ईवेंट हैंडलर्स के साथ अच्छे पुराने hover फ़ंक्शन का उपयोग कर सकते हैं:

$(document).on('hover', '.top-level', function (event) { 
    $(this).find('.actionfcnt').show(); 
    $(this).find('.dropfcnt').show(); 
}, function() { 
    $(this).find('.dropfcnt').hide('blind', function() { 
    $('.actionfcnt').hide(); 
    }); 
}); 

Answer 1

jQuery 1.8 के रूप में पदावनत की कोशिश करो। यह उन दो घटनाओं के लिए एक एकल ईवेंट हैंडलर को जोड़ता है, और हैंडलर को इवेंट.टाइप की जांच करनी चाहिए ताकि यह निर्धारित किया जा सके कि ईवेंट माउसेंटर या माउसलेव है या नहीं। को "होवर" छद्म-घटना-नाम को .hover() विधि से भ्रमित न करें, जो एक या दो कार्यों को स्वीकार करता है।

स्रोत: http://api.jquery.com/on/#additional-notes

कि काफी कहते हैं यह सब, आप नहीं कर सकते कि के लिए "होवर करें" का उपयोग करें:

$(document).on('mouseenter','.top-level', function (event) { 
    $(this).find('.actionfcnt').show(); 
    $(this).find('.dropfcnt').show(); 
}).on('mouseleave','.top-level', function(){ 
    $(this).find('.dropfcnt').hide('blind', function(){ 
     $('.actionfcnt').hide(); 
    }); 
}); 

Answer 2

.on समारोह केवल 3 मानकों है।

$('.top-level').hover(function (event) { 
    $(this).find('.actionfcnt').show(); 
    $(this).find('.dropfcnt').show(); 
}, function (event) { 
    $(this).find('.dropfcnt').hide('blind', function(){ 
    $('.actionfcnt').hide(); 
    }); 
});​ 

वैसे, $(selector).hover(handlerIn, handlerOut)$(selector).mouseenter(handlerIn).mouseleave(handlerOut); के लिए आशुलिपि है।

आप, तो mouseenter और mouseleave घटनाओं के लिए on उपयोग करने के लिए की जरूरत है:

$(document).on('mouseenter', '.top-level', function (event) { 
    $(this).find('.actionfcnt').show(); 
    $(this).find('.dropfcnt').show(); 
}).on('mouseleave', '.top-level', function (event) { 
    $(this).find('.dropfcnt').hide('blind', function(){ 
    $('.actionfcnt').hide(); 
    }); 
});​ 

Answer 3

कोई "मंडराना" घटना है। वहाँ हैवर() फ़ंक्शन है जो 2 कॉलबैक लेता है (जैसा कि आपके उदाहरण में है)। नाम "मंडराना" स्ट्रिंग "mouseenter mouseleave" के लिए एक आशुलिपि के रूप में प्रयोग किया है:

Answer 4

$('.top-level').hover(function (event) { 
     $(this).find('.actionfcnt').show(); 
     $(this).find('.dropfcnt').show(); 
}, function(){ 
     $(this).find('.dropfcnt').hide('blind', function(){ 
      $('.actionfcnt').hide(); 
     }); 
}); 

Answer 5

jQuery 1.8 के साथ इस कोड का प्रयास करें मुझे लगता है कि वह ठीक काम:

$(document).ready(function(){ 
    $('.top-level').hover(
     function() { 
      $(this).find('.actionfcnt').show(); 
      $(this).find('.dropfcnt').show(); 
     }, 
     function() { 
      $(this).find('.dropfcnt').hide('blind', function(){ 
       $('.actionfcnt').hide(); 
      }); 
     } 
    ); 
}); 

Answer 6

प्रयास करें:

$(".top-level").on({ 
    mouseenter: function (event) { 
     $(this).find('.actionfcnt').show(); 
     $(this).find('.dropfcnt').show(); 
    }, 
    mouseleave: function (event) { 
     $(this).find('.dropfcnt').hide('blind', function(){ 
      $('.actionfcnt').hide(); 
     }); 
    } 
}); 

या

$(".top_level").on("hover", function(event) { 
    if(event.type == "mouseenter") { 
    $(this).find('.actionfcnt').show(); 
    $(this).find('.dropfcnt').show(); 
    } 
    else if (event.type == "mouseleave") { 
    $(this).find('.dropfcnt').hide('blind', function(){ 
     $('.actionfcnt').hide(); 
    }); 
    } 
});