Question

我有一个脚本可以在自动加载时将youtube链接转换为工作iframe，一旦用户点击带有预加载缩略图的元素，它就会生成一个可观看的iFrame。代码的主要部分可以工作，但是在单击元素后告诉它运行时它不想工作。我试图开始运行的代码删除了＆＃39; scr＆＃39;包含＆＃39;＆amp;＆＃39;的网址之后。

点击缩略图元素后，会加载iframe：.youtube-box

点击.youtube-box后调用iframe：

<iframe class="youtube-frame" src="http://www.youtube.com/embed/qYTT-0A8QIE&amp;list=PLbfa3OWXAjLMk5PKV2KDaRveQt8BntMK5&amp;t=4s&amp;index=13?rel=0;&amp;autoplay=1&amp;vq=hd720" style="height: 622px;"></iframe>

我的代码：

$(window).on("load", function(){ 

$(".youtube-box").click(function () {

setTimeout(function(){

jQuery('iframe').attr('src',function(i,v){
   return v.split('&')[0]; // get the string part before the `?`
   // or 
   // return v.replace(/\?.*/,'');
});

}, 2000); 

});  

});

删除的内容是什么：

&amp;list=PLbfa3OWXAjLMk5PKV2KDaRveQt8BntMK5&amp;t=4s&amp;index=13?rel=0;&amp;autoplay=1&amp;vq=hd720

Answer 1

这是一个暂时的修复，但不是我发现的绝对解决方案，基本上我只是添加到将元素转换为iframe的脚本

<script>
$(window).on("load", function(){
$(function() {
    $('a[href^="https://www.youtube.com/watch"]').each(function() {
        var yt_url = this.href,
            yt_id = yt_url.split('?v=')[1],
            yt_title = $(this).text();
        $(this).replaceWith('<div class="youtube-box" style="background-image:url(http://img.youtube.com/vi/' + yt_id + '/0.jpg);"><span class="youtube-title">' + yt_title + '</span><span class="youtube-bar"><span class="yt-bar-left"></span><span class="yt-bar-right"></span></span><span class="youtube-play"></span></div>');
        $('div.youtube-box').click(function() {
  $(this).replaceWith('<iframe class="youtube-frame" src="http://www.youtube.com/embed/' + yt_id + '?rel=0;&autoplay=1&vq=hd720"></iframe>');

// added to remove youtube playlist from iframe url
jQuery('iframe').attr('src',function(i,v){
   return v.split('&l')[0]; // get the string part before the `?`
   // or 
   // return v.replace(/\?.*/,'');            
});

        });
    });
});
});
</script>

回答我的第二个问题，我把代码放在上面的代码之前，以修复损坏的缩略图：

<script>
  $(window).on("load", function(){
  jQuery('a').attr('href',function(i,v){
   return v.split('&l')[0]; // get the string part before the `?`
   // or 
   // return v.replace(/\?.*/,'');            
});
    });
</script>

.click + v.split不能一起工作？

1 个答案: