मैं jQuery में "हॉवर" को कैसे हटाऊं?

107

मैं jQuery में "होवर" को कैसे अनबंड करूं?

यह काम नहीं करता:

$(this).unbind('hover');

javascript jquery

— zsharp
स्रोत

2

क्या आप किसी फ़ंक्शन को हॉवर ईवेंट में असाइन करने का प्रयास कर रहे हैं, या आप एक <a> </a> होवर को संशोधित करने का प्रयास कर रहे हैं?

— जस्टिन निस्नर

जस्टिन नीस्नर के प्रश्न को स्पष्ट करने के लिए, क्या आप जावास्क्रिप्ट / DOM ईवेंट्स, या CSS घोषणाओं को हटाने की कोशिश कर रहे हैं? उत्तरार्द्ध अधिक जटिल मामला है।

— पलकहीनता

214

$(this).unbind('mouseenter').unbind('mouseleave')

या अधिक सफलतापूर्वक (धन्यवाद @ अनुदान अनुदान ):

$(this).unbind('mouseenter mouseleave')

— वर्धमान ताजा
स्रोत

42

या $ (यह) .unbind ('माउसएंटर मूसलीव')

— चाड ग्रांट

क्या यह मूषक के लिए आवश्यक अनुक्रम है और फिर मूसलीव के बाद?

— सांगवी s

70

वास्तव में, jQuery प्रलेखन में ऊपर दिखाए गए जंजीर उदाहरणों की तुलना में अधिक सरल दृष्टिकोण है (हालांकि वे ठीक काम करेंगे)

$("#myElement").unbind('mouseenter mouseleave');

JQuery 1.7 के रूप में, आप उपयोग करने में सक्षम हैं $.on()और $.off()ईवेंट बाइंडिंग के लिए, इसलिए होवर ईवेंट को अनबाइंड करने के लिए, आप सरल और टिडियर का उपयोग करेंगे:

$('#myElement').off('hover');

छद्म-घटना-नाम "होवर" का उपयोग "माउसेंटर मूसलीव" के लिए शॉर्टहैंड के रूप में किया जाता है, लेकिन पहले के jQuery संस्करणों में इसे अलग तरह से संभाला जाता था; आपको शाब्दिक ईवेंट नामों में से प्रत्येक को स्पष्ट रूप से निकालने की आवश्यकता है। $.off()अब का उपयोग करके आप एक ही शॉर्टहैंड का उपयोग करके दोनों माउस घटनाओं को छोड़ सकते हैं।

2016 संपादित करें:

फिर भी एक लोकप्रिय प्रश्न तो यह है कि नीचे दिए गए टिप्पणियों में @ Dennis98 के बिंदु पर ध्यान आकर्षित करने के लायक है jQuery 1.9+ में, "हॉवर" घटना को मानक "माउसेंटर मूसलीव" कॉल के पक्ष में चित्रित किया गया था । तो आपकी घटना बाध्यकारी घोषणा अब इस तरह दिखना चाहिए:

$('#myElement').off('mouseenter mouseleave');

— Phil.Wheeler
स्रोत

4

मेरे पास jQuery 1.10.2 है और यह $.off("hover")काम नहीं करता है। हालांकि, दोनों घटनाओं का उपयोग करना महान काम करता है।

— एलेक्सिस विलके

वर्थ उल्लेख करते हुए कि जब कई फ़िल्टरिंग तर्क दिए जाते हैं, तो प्रदान किए गए सभी तर्क, इवेंट हैंडलर को हटाने के लिए मेल खाना चाहिए। मैं यह भी नोट करता हूं कि jQuery एपीआई डॉक्स यह बताता है कि .off () विधि ईवेंट हैंडलर को हटाता है जो .on () से जुड़े थे। क्या इसका मतलब है कि यह केवल .on () का उपयोग करके जोड़े गए ईवेंट पर लागू होता है, मुझे यकीन नहीं है। लेकिन ऐसा नहीं होना चाहिए।

— फिल.हेलर

@AlexisWilke हां, यह v1.9 में हटा दिया गया, अंतिम लिंक देखें ..;)

— डेनिस 98

1

@ डेनिस98 - आप सिर्फ jQuery होवर हैक के बारे में बात कर रहे हैं, जिसे हटा दिया गया है। ठीक है? $ .off () ईवेंट बाइंडिंग अभी भी jQuery के बाद के संस्करणों में उपलब्ध है।

— फिल.हेलर

सही। :) $.off()अभी भी है, यह वर्तमान में अप्रिय घटनाओं की अनुशंसित विधि है। इसलिए अब आपको लिखने की जरूरत है $(element).off("mouseenter mouseleave");।

— डेनिस98

10

Unbind mouseenterऔर mouseleaveघटनाओं व्यक्तिगत रूप से या अनबाइंड तत्व (ओं) पर सभी घटनाओं।

$(this).unbind('mouseenter').unbind('mouseleave');

या

$(this).unbind();  // assuming you have no other handlers you want to keep

— tvanfosson
स्रोत

4

unbind () हार्डकोड इनलाइन घटनाओं के साथ काम नहीं करता है।

इसलिए, उदाहरण के लिए, यदि आप माउसओवर इवेंट को अनबाइंड करना चाहते हैं, तो <div id="some_div" onmouseover="do_something();">मैंने पाया कि $('#some_div').attr('onmouseover','')इसे प्राप्त करने का एक त्वरित और गंदा तरीका है।

— Jaytop
स्रोत

4

एक अन्य समाधान है .die () की घटनाओं जो उस के साथ संलग्न के लिए .live () ।

पूर्व .:

// attach click event for <a> tags
$('a').live('click', function(){});

// deattach click event from <a> tags
$('a').die('click');

आप यहाँ एक अच्छा refference पा सकते हैं: खोज jQuery .live () और .die ()।

(मेरे अंग्रेजी के लिए क्षमा करें: ">)

— Briganti
स्रोत

2

सभी मंडराना पर्दे के पीछे से माउसओवर और माउसआउट संपत्ति के लिए बाध्य है। मैं उन घटनाओं से आपके कार्यों को अलग-अलग बाँधूँगा और उन्मुक्त करूँगा।

उदाहरण के लिए, मान लें कि आपके पास निम्नलिखित HTML हैं:

<a href="#" class="myLink">Link</a>

तब आपका jQuery होगा:

$(document).ready(function() {

  function mouseOver()
  {
    $(this).css('color', 'red');
  }
  function mouseOut()
  {
    $(this).css('color', 'blue');
  }

  // either of these might work
  $('.myLink').hover(mouseOver, mouseOut); 
  $('.myLink').mouseover(mouseOver).mouseout(mouseOut); 
  // otherwise use this
  $('.myLink').bind('mouseover', mouseOver).bind('mouseout', mouseOut);


  // then to unbind
  $('.myLink').click(function(e) {
    e.preventDefault();
    $('.myLink').unbind('mouseover', mouseOver).unbind('mouseout', mouseOut);
  });

});

— bendewey
स्रोत

सुधार, jquery src होवर को देखने के बाद वास्तव में माउसएंटर / मूसलीव के लिए बाध्य होता है। आपको भी ऐसा ही करना चाहिए।

— बेंडवेय

2

आप एक विशिष्ट ईवेंट हैंडलर को निकाल सकते हैं on, जिसका उपयोग करके संलग्न किया गया थाoff

$("#ID").on ("eventName", additionalCss, handlerFunction);

// to remove the specific handler
$("#ID").off ("eventName", additionalCss, handlerFunction);

इसका उपयोग करते हुए, आप केवल हैंडलर को हटा देंगे
एक और अच्छा अभ्यास, कई संलग्न घटनाओं के लिए एक नामस्थान सेट करना है

$("#ID").on ("eventName1.nameSpace", additionalCss, handlerFunction1);
$("#ID").on ("eventName2.nameSpace", additionalCss, handlerFunction2);
// ...
$("#ID").on ("eventNameN.nameSpace", additionalCss, handlerFunctionN);

// and to remove handlerFunction from 1 to N, just use this
$("#ID").off(".nameSpace");

— हलीम अनीस
स्रोत

0

मैंने इसे .hover () के लिए दूसरे तर्क (फ़ंक्शन) के रूप में काम किया

$('#yourId').hover(
    function(){
        // Your code goes here
    },
    function(){
        $(this).unbind()
    }
});

पहला फ़ंक्शन (तर्क .hover ()) माउसओवर है और आपके कोड को निष्पादित करेगा। दूसरा तर्क माउसआउट है जो #yourId से होवर ईवेंट को हटा देगा। आपके कोड को केवल एक बार निष्पादित किया जाएगा।

— Foppe
स्रोत

1

क्या यह $.unbind()अपने आप से इस तरह की सभी घटनाओं को उस वस्तु से नहीं हटाएगा? किस मामले में आपकी $.click()घटनाओं जैसी चीजें अब विफल हो जाएंगी, है ना?

— एलेक्सिस विलके