Добавяне на URL към iframe, извикван от Fancybox2-AJAX въз основа на ID на iframe

Добре, това работи минус факта, че това работи, след като се обадя с fancybox чрез AJAX.

Статичен пример работи:

 <iframe id="videourl1" width="640" height="340" src="" frameBorder="0"></iframe>
 <iframe id="videourl2" width="640" height="340" src="" frameBorder="0"></iframe>
 <iframe id="videourl3" width="640" height="340" src="" frameBorder="0"></iframe>

$("div.video-container iframe").each(function(){var idAdd=$(this).attr("id");$(this).attr("src","http://www.youtube.com/embed/"+idAdd+"?rel=0&autoplay=0&modestbranding=1&showinfo=0&autohide=1")})

Сега, когато взема това и издърпвам 3-те вградени рамки в .txt файлове и ги извиквам от файл index.html с помощта на fancybox2-ajax, извикването се проваля:

Index.html:

  <a id="1" class="fancybox fancybox.ajax" href="/bgtext/1.txt">Link</a>
  <a id="2" class="fancybox fancybox.ajax" href="/bgtext/2.txt">Link</a>
  <a id="3" class="fancybox fancybox.ajax" href="/bgtext/3.txt">Link</a> 

Текстовите файлове съдържат iframes:

  <iframe id="videourl" width="640" height="340" src="" frameBorder="0"></iframe>

Как да кодирам JS, за да кажа, че се изпълнява всеки път, когато iframe се извиква от AJAX?


person RooksStrife    schedule 23.07.2014    source източник
comment
Отговор: $(".fancybox").fancybox({ afterShow: function() { $("div.video-container iframe").each(function(){var idAdd=$(this).attr("id");$(this).attr("src","http://www.youtube.com/embed/"+idAd‌​d+"?rel=0&autoplay=0&modestbranding=1&showinfo=0&autohide=1")}); } });   -  person RooksStrife    schedule 24.07.2014


Отговори (2)


Можете да използвате fancybox callback afterLoad, за да стартирате javascript, след като съдържанието е заредено.

Въпреки това изглежда ненужно да прескачате всички тези обръчи, за да заредите видеоклип, вместо просто да използвате медийния помощник:

<a class="fancybox-media" href="http://www.youtube.com/watch?v=opj24KnzrWo">Youtube</a>

<script type="text/javascript">
$(document).ready(function() {
    $('.fancybox-media').fancybox({
        helpers : {
           media : {}
    }
});
</script>

});

person Khan    schedule 23.07.2014
comment
Случва се много повече от видеоклипа в YouTube. Имам много съдържание и какво ли още не се извиква във FancyBox с видеоклипа. Просто публикувайте артикулите. Така че се опитах да добавя afterLoad, който изглежда не работи, може би го прави погрешно. Ето го - $(".fancybox").fancybox({ afterLoad: function() { $("div.video-container iframe").each(function(){var idAdd=$(this).attr("id");$(this).attr("src","http://www.youtube.com/embed/"+idAdd+"?rel=0&autoplay=0&modestbranding=1&showinfo=0&autohide=1")}); } }); - person RooksStrife; 24.07.2014
comment
Решено - използвано е afterShow на FacnyBox. - person RooksStrife; 24.07.2014

Отговор:

$(".fancybox").fancybox({
    afterShow: function () {
        $("div.video-container iframe").each(function () {
            var idAdd = $(this).attr("id");
            $(this).attr("src", "http://www.youtube.com/embed/" + idAd‌d + "?rel=0&autoplay=0&modestbranding=1&showinfo=0&autohide=1")
        });
    }
});
person RooksStrife    schedule 23.07.2014
comment
няма ли да е по-лесно да свържете директно към всеки видеоклип в YouTube и да добавите класа fancybox.iframe към връзката? - person JFK; 24.07.2014
comment
Fancybox съдържа три колони. Единият има видеоклип в youtube, а другите два съдържат и изображение. Ето защо не правя директна връзка към видеоклипа в YouTube. Освен ако не пропускам нещо. Наистина не трябваше да правя връзката към YouTube динамична, но си помислих, че ще бъде по-лесно да редактирам, като просто променям идентификатора на iftame вместо да се уверя, че съвпада с yt url и подавам низовете към yt за плейъра всеки път. Особено ако някой друг го редактира. Хората винаги забравят rel и тогава получавате нежелани видеоклипове или те използват различно вграждане. Исках да избегна това ;) - person RooksStrife; 24.07.2014
comment
Хей, JFK - тъй като изглежда, че наистина си добър с FB2, имам нов/същият проблем като по-горе. Когато вляза в страницата с #hashtag, той задейства FB, но сега с кода по-горе го прави, без видеоклипът в YouTube да се попълва. Не знам защо, тъй като използвам callBack afterShow. Работи, ако отидете на сайта и след това щракнете, но не директно от URL. Код в следващия коментар.... - person RooksStrife; 25.07.2014
comment
Добавете отделен въпрос за това - stackoverflow.com/questions/24960954/fancybox2-ajax- хаштаг - person RooksStrife; 25.07.2014
comment
Настоявам: би било по-добре да поставите директна връзка към видеоклипове в youtube и да ги отворите в iframe. Не виждам причината да използвам прекалено сложни извиквания към текстови файлове с iframe кодове. Но ми се струва, че не искате да го направите иначе - person JFK; 25.07.2014
comment
Съгласен съм с вас, но за това трябва да отворя видеоклип в YouTube, да имам описание на видеоклипа и някои свързани връзки в изскачащия прозорец. Така че не мога да го опростя само до видеоклипа в YouTube. Освен това имам няколко от тях на страница - като по този начин имам 20+ вградени рамки, зареждащи YouTube - затова избрах пътя на AJAX. Сега пускам идентификатора за видеоклипа в YT, вместо просто да пиша всяка връзка - това е, че се опитвам да избегна изписването на www...rel=0... отново и отново и е възможно да избегна другите да оставят rel=0.. .. за видеоклиповете в YouTube. Има ли смисъл защо го правя? - person RooksStrife; 25.07.2014