JQuery .Clone（）丢失了click事件

我正在使用流沙为我的网站添加一些很酷的排序。

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

但我遇到的问题是，当我克隆我的数据（内容）进行排序时，点击事件会丢失。

我的网站是andrewsimonmcallister.tv，这是我正在讨论的video部分。 我会尽量提供尽可能多的信息，如果我错过了anthing只是问。

这是HTML部分

 
 
TV Series : Planet of the Apemen
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.
 1 98 TV 
 
 
Film : Macropolis
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.
 2 97 FILM 
 
 
Scoring Session : Looking Glass
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.
 3 99 ZSCORING 
 
 
Scoring Session : Family Retreat
Recording from a live scoring session for the title track to the movie Family Retreat. It's big, fun and light hearted.
 4 100 ZSCORING 
  

在video链接的点击事件中，我克隆数据/内容

 $("#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"; }); 

我在每个div上的标签上都有一个click事件，它基本上设置了哪个video在花式框启动之前播放

 $("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!"); }); 

此事件有效，直到您单击顶部的其中一个单选按钮并执行排序。 然后事件就丢失了。

这是排序代码

  (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 : 0; } else { return (valA  valB) ? 1 : 0; } }); return $(arr); }; })(jQuery); 

正如您所看到的，我已经添加了控制台日志记录以显示触发的位置，因此如果打开Java控制台，您可以看到事件正在丢失。

要完全演示 – 点击网站，点击video菜单项。 然后点击apemenvideo的第一个星球，你可以看到控制台记录和video将播放。 然后单击按日期排序。 点击说macropolis，这次没有射击，video卡在猿人的星球上。 但是，如果你再次访问该网站，进入video部分，只需点击每个video而不进行任何排序，你可以看到事件总是会触发并且有效。

Answer 1

使用.clone(true)来处理数据和事件： http ： .clone(true)

Answer 2

所以我删除了点击事件来设置video。 然后使用fancybox中的标题引用tio传递video名称，并在那里更改代码以设置video，因为fancybox始终打开，所以我知道该事件正在解雇。