2012-09-13 20 views
7

यह मेरा सवाल है, और यहां मेरा उदाहरण कोड है।क्या Fancybox म्यूट घटनाओं पर क्लिक करें?

HTML:

<a class="fancybox" rel="group" href="img1.jpg"> <img src="img1_thumb.jpg"> </a> 
<a class="fancybox" rel="group" href="img2.jpg"> <img src="img2_thumb.jpg"> </a> 

जे एस:

var header = '<img id="w" src="logo.gif">'; 

$('.fancybox').fancybox({ 
    afterLoad: function() { 
     this.wrap.prepend(header); 
    }, // afterLoad 
}); //fancybox 

$('#w').click(function() {console.log('clicked');}); 

आप FancyBox शुरू करने के लिए एक थंबनेल क्लिक करते हैं, afterLoad शीर्षक में छोड़ देंगे, लेकिन आप छवि पर क्लिक करें और कंसोल घड़ी जब बाबाजी का थुल्लु।

विचार? मैं फैंसीबॉक्स की $.fancybox.close() विधि का उपयोग करने की कोशिश कर रहा हूं, लेकिन अगर मुझे क्लिक इवेंट को आग नहीं मिल पाती है, तो मुझे इनलाइन का उपयोग करने के लिए मजबूर होना पड़ता है, जिसे मैं जेएस इनलाइन का उपयोग न करने के लिए नहीं करना चाहता हूं।

उत्तर

2

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

+0

तो क्या मैं हेडर को प्रीपेड करने के बाद 'afterLoad' फ़ंक्शन' पर '$ (' # w ') जैसे कुछ (' क्लिक ', फ़ंक्शन() {$। Fancybox.close()}) डालूँगा? –

+0

उसने ऐसा किया! बहुत बहुत धन्यवाद। –

+0

बस सोचा कि मैं जोड़ता हूं कि 'afterLoad' कॉलबैक में' $ .fancybox.close() 'फ़ंक्शन बाध्यकारी इष्टतम नहीं था। जब आप अगली छवि पर स्क्रॉल करते हैं तो 'नया' हेडर ईवेंट को संभाल नहीं करता है। मैंने क्लिक हैंडलर को 'आफ्टरशो' कॉलबैक पर ले जाकर इसे ठीक किया। –