使用 jQuery 和 JSON 的动态 Youtube 视频答案

【问题标题】：Dynamic Youtube Video With jQuery & jSON使用 jQuery 和 JSON 的动态 Youtube 视频
【发布时间】：2011-03-28 17:03:03
【问题描述】：

所以我有一个 JSON 对象回来了，我想从对象中提取缩略图，添加点击事件，一旦点击它就会基于 JSON 对象构建 SWF 播放器。我很难将缩略图“绑定”到 SWF。因此，当您单击此缩略图时，构建此 SWF。

这是一个提取缩略图的 JSFiddle。我不确定我是否设置正确。不确定是否需要在 for 循环中设置点击事件。

任何帮助将不胜感激。

【问题讨论】：

【解决方案1】：

它应该不在循环中，因为您（正确）使用 live 方法。

但是，您错误地传递了 swf 数据。

应该是$('.thumbnail').live('click', {swf:$swf}, function(e){

现在您可以使用 e.data.swf 从处理程序内部访问它

您还可以使用.die()^docs 方法取消绑定以前的实时点击处理程序（以防您的代码运行多次），所以

$('.thumbnail').die('click').live('click', {swf:$swf}, function(e){

我还修改了您的代码，在每个缩略图上添加了一个标识符，以便您可以轻松地将它们映射到视频数组。

$videos += '<li class="video"><img class="thumbnail" data-videoid="'+$i+'" src="' + $thumbnail + '" alt="' +$title + '" /></li>';

当您使用.data()^docs 方法作为$(this).data('videoid') 单击元素时，您可以检索此videoid

【讨论】：