jQuery向每个div追加一次

我正在开发ServiceNow服务门户中的YouTube小部件，并且遇到了.append问题。追加是iframes附加到我的div多次，但我只希望它追加一次。我的HTML和客户端代码如下：jQuery向每个div追加一次

<div class="panel panel-default"> 
    <div class="panel-heading"> 
    <span class="panel-title"><i class="fa fa-{{c.glyph}}" aria-hidden="true"></i>&nbsp; {{c.title}}</span> 
    </div> 

    <div class="fluidMedia"></div> 
    </div>

客户端脚本：

function($scope,$sce,spModal) { 
     var c = this; 

     //Get option values 
     c.title = c.options.title || 'Training Video'; 
     c.glyph = c.options.glyph || 'youtube'; 
     //c.video = c.options.video_url; 

     console.log('Options'); 
     console.log(c.options); 

     c.server.get().then(function(r) { 
      console.log('Response'); 
      console.log(r); 
      c.data.video = $sce.trustAsResourceUrl(r.data.video); 
      $('div .fluidMedia').append('<iframe class="media" src='+ c.data.video +' frameborder="0" allowfullscreen></iframe>') 
     }); 
    }

在我的控制台我看到这一点，3个视频基本上都是分层在彼此的顶部，因为所有的人都被附加到div.fluidMedia。我如何得到它，以便将不同的视频添加到每个div.fluidMedia？谢谢！

来源

2017-05-31 Dave

如何我会得到它，因此不同的视频附加到每个div.fluidMedia？

“Each div.fluidMedia”。只有一个。您可能需要1个div.fluidMedia，每次都会替换iframe，您会看到一个新视频。

$('.fluidMedia iframe').empty(); 
$('div .fluidMedia').append('<iframe class="media" src='+ c.data.video +' frameborder="0" allowfullscreen></iframe>')

或与类 “fluidmedia”

$(.panel).append('<div class="fluidMedia"><iframe class="media" src='+ c.data.video +' frameborder="0" allowfullscreen></iframe></div>');

多个div

来源

2017-06-30 05:48:02

jQuery向每个div追加一次

回答

相关问题