jQuery .live() काम नहीं कर रहा

Question

मेरी वास्तविक समस्या यह है कि .live() jQuery विधि काम नहीं कर रही है। मैं .live विधि का इस्तेमाल किया

<script type="text/javascript" src="ui/js/jquery-1.4.2.js"></script> 
<script type="text/javascript" src="ui/js/jquery-ui-1.8.1.custom.min.js"></script> 
<script type="text/javascript" src="ui/js/color.js"></script> 
<script type="text/javascript" src="engine/js/tiny_mce/tiny_mce.js"></script> 
<script type="text/javascript" src="ui/js/ui.js"></script> 
<script type="text/javascript"> 
    // UI effects 
    $(document).ready(function() 
    { 
     $('button').sb_animateButton(); 
     $('input').sb_animateInput(); 
     $('.top_menu_item').sb_animateMenuItem(); 
     $('.top_menu_item_right').sb_animateMenuItem(); 
     $('.left_menu_item').sb_animateMenuItem(); 
    }); 
</script> 

के बाद से मेरी साइट AJAX अनुरोध का उपयोग करता है:

jQuery.fn.sb_animateMenuItem = function() 
    { 
    var mousehoverColor = '#0089F7'; 
    var duration = 250; 

    return this.each(function() 
    { 
     var originalColor = $(this).css('background-color'); 
     $(this).live('mouseover', function() 
     { 
      this.style.cursor = 'pointer'; 
      $(this).animate().stop(); 
      $(this).animate(
      { 
       backgroundColor: mousehoverColor 
      }, duration); 
     }); 
     $(this).live('mouseout', function() 
     { 
      this.style.cursor = 'default'; 
      $(this).animate(
      { 
       backgroundColor: originalColor 
      }, duration); 
     }); 
    }); 
}; 

यह Snipped इस तरह से मैं एक और पेज प्रयोग किया जाता है:

इस कोड को जहां मैं इसका इस्तेमाल सी पहले स्निपेट में, लेकिन जब मैं पृष्ठ लोड करता हूं तो प्रभाव बटन/इनपुट ... टैग लागू नहीं होते हैं।

तो मैं .live विधि निकालकर 'सामान्य' तरीके से उपयोग, ui पहले Snipped में परिभाषित प्रभाव से लागू होते हैं लेकिन केवल तत्व किसी भी AJAX अनुरोध से पहले भरी हुई। AJAX अनुरोध के बाद लोड किए गए तत्व पहले स्निपेट से प्रभावित नहीं होते हैं (हालांकि उनके पास एक ही चयनकर्ता है)।

मदद के लिए धन्यवाद।

Answer 1

छोटा है, आप .live() इस तरह उपयोग नहीं कर सकते, यह है किसी प्रकार की एक चयनकर्ता आधार पालन करने के लिए, इस from the .live() docs है में:

डोम ट्रेवर्सल तरीकों को पूरी तरह से करने के लिए तत्वों को खोजने के लिए समर्थित नहीं हैं .live() पर भेजें। इसके बजाय, ऊपर दिए गए उदाहरण में, .live() विधि को हमेशा चयनकर्ता के बाद सीधे कॉल किया जाना चाहिए।

आप एक jQuery वस्तु एक विशेष डोम तत्व का प्रतिनिधित्व करने पर .live() कॉल कर रहे हैं, बजाय आप इस पाठ्यक्रम के इसकी गारंटी नहीं है, .selector प्लगइन्स पर चल रहा है, अगर वहाँ एक है प्राप्त करने की आवश्यकता है, तो का उपयोग कि .live के लिए, इस तरह:

jQuery.fn.sb_animateMenuItem = function() { 
    $(this.selector).live(.....) 

आप इसके बारे में सोचते हैं, तो कैसे .live() काम करता है? यह बुलबुला करने के लिए घटना के लिए सुनता है इसकी जांच करता है लक्ष्य से मेल खाता है एक चयनकर्ता, और कार्यान्वित यदि ऐसा है तो (और एक संदर्भ में, कि एक पूरी अन्य चर्चा है) ... यदि आप $(DOMElement).live() किया था, क्या चयनकर्ता यह अगर यह देखने के लिए जाँच कर रहा है निष्पादित करना चाहिए?

मुझे लगता है कि आप आंतरिक तत्व UUID इस चाहिए काम के आधार पर बहस कर सकते हैं, लेकिन उसके बाद फिर से कि सिर्फ एक .bind() है, जो कम बेकार हो जाएगा है, तो .live() ऐसा कुछ नहीं करता है।

---

अद्यतन: क्योंकि मैं कोड दोहराए बिना इस लागू करने के लिए सबसे आसान तरीका है के बारे में उत्सुक था, यहाँ प्लगइन है कि .live() या .bind() चुनता गतिशील, के आधार पर की एक संस्करण है अगर वहाँ एक चयनकर्ता .live() करने के लिए मौजूद है उपयोग करें:

jQuery.fn.sb_animateMenuItem = function() { 
    var mousehoverColor = '#0089F7'; 
    var duration = 250; 
    var method = this.selector ? jQuery.fn.live : jQuery.fn.bind; 
    method.apply(this, ['mouseover', function() { 
    if(!jQuery.data(this, 'oColor')) 
     jQuery.data(this, 'oColor', jQuery(this).css('background-color')); 
    jQuery(this).stop(true).animate({ backgroundColor:mousehoverColor }, duration); 
    }]); 
    method.apply(this, ['mouseout', function() { 
    jQuery(this).animate({ backgroundColor:jQuery.data(this, 'oColor') }, duration); 
    }]); 
    return this.css('cursor', 'pointer'); 
}; 

You can view a working demo showing both here।

Answer 2

आप .DELEGATE() के बजाय .LIVE, .ON, उपयोग कर सकते हैं।BIND

$("body").DELEGATE($(this),"click","myfunction") 

या

$("body").DELEGATE($(this),"click",function() { 
///code here 
})