Question

我正在使用Embedly从视频网站生成缩略图和视频预览。这是代码：

<ul id="galleryThumb">
  <li id="1"><a href="http://www.youtube.com/watch?v=wTcz-etqwKg" class="thumb">Video</a></li>
  <li id="2"><a href="http://www.youtube.com/watch?v=zVNTdWbVBgc" class="thumb">Video</a></li>
  <li id="3"><a href="http://www.youtube.com/watch?v=Q5im0Ssyyus" class="thumb">Video</a></li>
  <li id="4"><a href="http://www.youtube.com/watch?v=wCF3ywukQYA" class="thumb">Video</a></li>
</ul>

<script>
$(document).ready(function() {
$(".thumb").embedly({
        key : 'MY_KEY',
        className: "vidPreview"
    },
    function(oembed, dict) {
        if ( oembed == null)
            return;
        var output = "<a class='embedly' href='#'><img src='"+oembed.thumbnail_url+"' /></a>";
        output += oembed['code'];
        $(dict["node"]).parent().html(output);
    });
});
</script>

它的作用是用缩略图和视频预览替换所有视频链接。视频附有

<div class="vidPreview">

是动态创建的，vidPreview是在className中定义的。

我想要的是向此动态元素添加ID属性，我将从ID获取<li>作为ID的一部分。基本上，我想要的最终输出是：

<div id="vidPreview-1" class="vidPreview">

vidPreview-1来自<li>

的ID

Answer 1

$(dict["node"]).parent()附近的某个地方将是您尝试添加<div>的{{1}}。您可以致电id来设置id。您可以在拨打.setAttribute("id","vidPreview-" + num)的行下方拨打此电话。如果没有看到嵌入式操作的邻居中的dom片段，很难确切地告诉您使用哪些代码导航到.html(output)或<li>。

Answer 2

这是我的工作代码，以防万一有相同的情况：

$(".thumb").embedly({
    key : 'MY_KEY',
    className: "vidPreview"
},
function(oembed, dict) {
    if ( oembed == null) return;
    var test = $(dict["node"]).parent().attr("id");
    var output = "<a class='embedly' href='#'><img src='"+oembed.thumbnail_url+"' /></a>";
    output += oembed['code']; $(dict["node"]).parent().html(output).find("div").attr("id", "vidPreview-" + test);
});

将属性添加到动态创建的元素

2 个答案: