कलरबॉक्स

Question

की jQuery परिवर्तन सामग्री मैंने सिमलीर खिताब के साथ पहले से ही प्रश्नों की कोशिश की, लेकिन वे काम नहीं करते हैं। (उदाहरण के लिए: How to load AJAX content into current Colorbox window?): (jQuery 1.6.1 सहित)

<script type="text/javascript" src="js/jquery.colorbox.js"></script> 
<link rel="stylesheet" type="text/css" href="css/colorbox.css" /> 
<script> 
jQuery(function(){ 
    $("#aLink").colorbox(); 
    $('#blub a[rel="open_ajax"]').live('click', function(e){ 
     e.preventDefault(); 
     var url = $(this).attr('href'); 
     $.ajax({ 
      type: 'GET', 
      url: url, 
      dataType: 'html', 
      cache: false, 
      beforeSend: function() { 
       //$('#cboxContent').empty(); 
       $('#cboxLoadedContent').empty(); 
       $('#cboxLoadingGraphic').show(); 
      }, 
      complete: function() { 
       $('#cboxLoadingGraphic').hide(); 
      }, 
      success: function(data) { 
       $('#cboxLoadedContent').append(data); 

      } 
     }); 
    }); 
    }); 
</script> 
<a href="1.html" id="aLink">colorbox open</a> 

यह ठीक काम करता है, (सरल) 1.html की सामग्री colorbox में भरी हुई है

मैं मुख्य पृष्ठ है:

1.html:

<div id="blub"> 
    <a rel="open_ajax" href="2.html">Change Content</a> 
</div> 

अब मैं लिंक पर klicking द्वारा सामग्री बदलना चाहते हैं। यह काम नहीं करता है। ईथर मुझे एक अतिरिक्त रंगबॉक्स मिलता है, या कुछ भी नहीं होता है।

Thanx!

Answer 1

आप मौजूदा और भविष्य के रंगीन लिंक पर क्लिक देखने के लिए एक jquery live() फ़ंक्शन का उपयोग कर सकते हैं। साथ ही, मैं अनुशंसा करता हूं कि आप अपने चयनकर्ता के रूप में rel का उपयोग न करें। वह विशेषता एसईओ में उपयोग के लिए है। तो इस उदाहरण में मैं वर्ग विशेषता को rel विशेषता से अपने चयनकर्ता स्थानांतरित कर दिया है:

$(document).ready(function() { 
    $('a.open_ajax').live('click', function(){ 
     $.colorbox({ 
      open:true, 
      href: this.href 
      //plus any other interesting options  
     }); 

     return false; 
    }); 
}); 

तो बस यकीन है कि कुछ भी है कि आप नए colorbox सामग्री ट्रिगर करना चाहते हैं "open_ajax" वर्ग और एक href है कि बनाने के । ईजी: के लिए

<a class="open_ajax" href="colorboxPage.html">Open</a>

अद्यतन jQuery 1.7+

jQuery 1.7 के लिए, के बाद से लाइव() पदावनत किया गया है, तो आप इसे इस तरह से करने की आवश्यकता होगी:

$(document).on("click", "a.open_ajax", function() { 
    //everything that was in the live() callback above 
});