如何委託查詢功能

Question

我有以下網頁：link to page。如果您轉到「Galería」部分，您可以在左側看到一張照片滑塊和一個菜單。滑塊上的每個圖像都是可點擊的，並且如果單擊，則會用剛剛單擊的照片填充空白區域。

正確到那裏。

事情是，當你想改變部分（在你的左邊，菜單上寫着「Nuestra tienda 2011」，「Mayo 2012」），假如我改變的內容是ul gallery在底部。

要做到這一點，我寫了這個代碼：

<div id="lista_galerias"> 
      <ul> 
       <li><div id="nuestra_tienda_show">Nuestra tienda 2011</div> 
        <script type="text/javascript"> 
         $('#nuestra_tienda_show').click(function() 
         { 
          $('.jCarousel').html(''); 
          $('<ul><li><div id="clickable"><img src="img/Escaparates_2011/img1.jpg" alt="Dormitorio azul turquesa." width="100" height="100"></img></div></li></ul>') 
           .prependTo('jCarousel'); 
          $('#galeria_seleccionada').html('Nuestra tienda 2011'); 
         }); 

        </script> 
       </li> 
       <li><div id="mayo_2012_show">Mayo 2012</div> 
        <script type="text/javascript"> 
         $('#mayo_2012_show').click(function() 
         { 
          $('.jCarousel').html(''); 
          $('<ul><li><div id="clickable"><img src="img/Mayo_2012/img1.jpg" alt="" width="100" height="100"></img></div></li></ul>') 
           .prependTo('.jCarousel'); 
          $('#galeria_seleccionada').html('Mayo 2012'); 
         }); 

        </script> 
       </li> 
      </ul> 
     </div> 

而且的jCarousel格：

<!-- DIV Contenedor de la imagen de la galería --> 
     <div id="containerGaleria"> 
      <div id="containerImage"></div> 
     </div> 
     <!-- DIV Contenedor de la galeria de imágenes --> 
     <div class="container_carousel"> 
      <div class="jCarousel"> 
       <ul> 
        <li><div id="clickable"><img src="img/Escaparates_2011/img1.jpg" alt="1" width="100" height="100"></div></li> 
        <li><div id="clickable"><img src="img/Escaparates_2011/img2.jpg" alt="2" width="100" height="100"></div></li> 
        <li><div id="clickable"><img src="img/Escaparates_2011/img3.jpg" alt="3" width="100" height="100"></div></li> 
       </ul> 
      </div> 
      <button class="prev"><<</button> 
      <button class="next">>></button> 
     </div> 

正如你所看到的，我有一個DIV包含的jCarousel，而另一一個帶有修改此jCarousel div內容的部分列表。

所以我的疑問是：

我想，也許當我抹去的jCarousel的HTML內容，由於某種原因，它不會重新加載的jCarousel影響，它顯示了......好吧，如一個沒有屬性的簡單列表。我怎麼能重新加載該jCarousel列表看到像什麼時候頁面的第一次加載？

編輯：我加了這一點：

$('#nuestra_tienda_show').click(function() 
    { 
     $('.jCarousel').html(''); 
     $('<ul><li><div id="clickable"><img src="img/Escaparates_2011/img1.jpg" alt="Dormitorio azul turquesa." width="100" height="100"></img></div></li></ul>') 
      .prependTo('.jCarousel'); 
     $('#galeria_seleccionada').html('Nuestra tienda 2011'); 
          $('.jCarousel').jCarouselLite({ 
           btnNext: ".next", 
           btnPrev: ".prev" 
          }); 
         }); 

但後來，我的名單不會出現。即使我只添加

$('.jCarousel').jCarouselLite(); 

Answer 1

我不能在頁面得到的，但似乎你缺少對.jCarousel 電話時，刪除旋轉臺（$（「的jCarousel」的全部內容）.html（''）;）並添加新內容，所有事件和jcarousel的所有內容都將消失。所以：

<script type="text/javascript"> 
    $('#nuestra_tienda_show').click(function() 
    { 
     $('.jCarousel').html(''); // Here, you loose all jcarousel events, etc 
     $('<ul><li><div id="clickable"><img src="img/Escaparates_2011/img1.jpg" alt="Dormitorio azul turquesa." width="100" height="100"></img></div></li></ul>') 
     .prependTo('jCarousel'); // this element is unknown to jcarousel 
     $('.jCarousel').jCarousell(); // Initialize the carousel again 
     $('#galeria_seleccionada').html('Nuestra tienda 2011'); 

    }); 
</script>