JQuery .Clone(), click olayını kaybediyor

Question

Web sitemde bir miktar sıralama eklemek için quicksand kullanıyorum.

http://razorjack.net/quicksand/docs-and-demos.html#examples

Ama sıralamak için benim veri (içerik) klonlamak zaman, tıklama etkinlikleri kaybolmak bir sorunu yaşıyorum.

Web sitem Andrewsimonmcallister.tv'dir, sözünü ettiğim video bölümüdür. Mümkün olduğu kadar çok bilgi vermeye çalışacağım, eğer eksikse sadece soruyorum. İşte

, ben her div etiketinin üzerinde bir tıklama olay

$("#open-videos").click(function(){ 
    console.log("Inside video"); 
    $(currentSection).hide(); 
    $("#video-player").hide(); 
    $("#contentbg").fadeIn(); 
    $("#videos").fadeIn(); 

    $filterType = $('input[name="type"]'); 
    $filterSort = $('input[name="sort"]'); 

    console.log("videos is " + $videos); 
    if ($videos== null) { 
    console.log("setting videos"); 
     $videos = $("#videolist"); 
    } 

    $videosdata = $videos.clone();  
    currentSection = "#videos"; 
}); 

veri/içerik klonlamak Video bağlantının tıklama olayda HTML bölüm

<ul id="videolist"> 
         <li data-id="1" data-type="tv" class="videoitem"> 
          <div name="video" class="video shadow"><img src="images/video/planetoftheapemen.jpg" border=0><videotitle>TV Series : Planet of the Apemen</videotitle><p>Clip from the National TV series produced by the BBC 'Planet of the Apemen: Battle for Earth'. This is the opening scene as we sweep over the mountains and see the tribes men tracking their kill. The cue is big and sweeping to match the imagery with a ostinato combined with a sweeping string melody.</p><a href="#videoplayer" class="fancybox" name="playvideo" rel="planetoftheapemen/mountain"><div class="watch"></div></a></div> 
          <default>1</default> 
          <date>98</date> 
          <sorttype>TV</sorttype> 
         </li> 
         <li data-id="2" data-type="film" class="videoitem"> 
          <div class="video"><img src="images/video/macropolisend.jpg" border=0><videotitle>Film : Macropolis</videotitle><p>Macropolis is a stop animation film produced by Flickerpix and directed by Joel Simon. In this particular scene our main protagonists finally get acceptance as a small boy buys them and takes them home. This is the final scene for the movie.</p><a href="#videoplayer" id="playvideo1" class="fancybox" rel="macropolis/ending"><div class="watch"></div></a></div> 
          <default>2</default> 
          <date>97</date> 
          <sorttype>FILM</sorttype> 
         </li> 
         <li data-id="3" data-type="scoring" class="videoitem"> 
          <div class="video"><img src="images/video/orchestra.jpg" border=0><videotitle>Scoring Session : Looking Glass</videotitle><p>Live recording session for the very delicate Looking Glass cue, taken from the drama of the same name. This cue features English Horn, Harp, Piano and Strings.</p><a href="#videoplayer" id="playvideo2" class="fancybox" rel="scoring/lookingglass"><div class="watch"></div></a></div> 
          <default>3</default> 
          <date>99</date> 
          <sorttype>ZSCORING</sorttype> 
         </li> 
         <li data-id="4" data-type="scoring" class="videoitem"> 
          <div class="video"><img src="images/video/brass-section.jpg" border=0><videotitle>Scoring Session : Family Retreat</videotitle><p>Recording from a live scoring session for the title track to the movie Family Retreat. It's big, fun and light hearted.</p><a href="#videoplayer" id="playvideo3" class="fancybox" rel="scoring/familyretreat"><div class="watch"></div></a></div> 
          <default>4</default> 
          <date>100</date> 
          <sorttype>ZSCORING</sorttype> 
         </li> 
        </ul> 

olduğunu temelde tıklanmadan Bu olay çalışır

$("a[id^='playvideo']").click(function(e){ 
    var videoselected = $(this).attr('rel'); 
    console.log("Clicked on link, rel value is " + videoselected); 
    $("#jquery_jplayer_9").jPlayer({ 
     play: function() { // To avoid both jPlayers playing together. 
      $(this).jPlayer("pauseOthers"); 
     }, 
     swfPath: "../js", 
     supplied: "m4v", 
     cssSelectorAncestor: "#jp_container_9" 
    }); 

    console.log("setting media to video/" + videoselected + ".m4v"); 
    $("#jquery_jplayer_9").jPlayer("setMedia", { 
     m4v: "video/" + videoselected + ".m4v" 
    }); 
    console.log("Try and play now!"); 

}); 

yılında fantezi kutu tekmeler önce oynamak için hangi video setleri Üstteki radyo düğmelerinden birinde bir sıralama yapın. Sonra olay kaybolur. İşte

sıralama kodu

(function($) { 
    $.fn.sorted = function(customOptions) { 
    var options = { 
     reversed: false, 
     by: function(a) { return a.text(); } 
    }; 
    $.extend(options, customOptions); 
    $data = $(this); 
    arr = $data.get(); 
    arr.sort(function(a, b) { 
     var valA = options.by($(a)); 
     var valB = options.by($(b)); 
     if (options.reversed) { 
     return (valA < valB) ? 1 : (valA > valB) ? -1 : 0;     
     } else {   
     return (valA < valB) ? -1 : (valA > valB) ? 1 : 0;  
     } 
    }); 
    return $(arr); 
    }; 
})(jQuery); 

ben şeyler bir olay kaybolmadan görebilirsiniz java konsolu açıp eğer öyleyse ateş nerede göstermek için konsol günlüğü eklemiş görebileceğiniz gibi olduğunu.

Web sitemize tamamen demo yapmak için video menü maddesine tıklayın. Ardından apemen videosunun ilk gezegenini tıklayın, konsol kaydını görebilir ve video oynayacaktır. Sonra tarihe göre sırala üzerine tıklayın. Makropolis üzerine tıklayın, bu sefer evets yok ve video apemen gezegenine yapışmış. Ancak tekrar web sitesine girerseniz, video bölümüne gidin ve herhangi bir sıralama yapmadan her videoya tıklayın. <a> etkinliğinin her zaman tetiklendiğini ve çalıştığını görebilirsiniz. veri ve olaylar için

Answer 1

yüzden videoyu ayarlamak için click olayını silindi. Daha sonra fancybox'taki başlık referansını kullanarak video adını geçirin ve videoyu fantezinin her zaman açıldığı şekilde ayarlamak için kodu değiştirin.

Answer 2

Kullanım .clone(true): http://api.jquery.com/clone/