Блог

Вот мой jQuery:

 $("object").each(function(){
    video_url  = $(this).find('embed').attr('src');
    new_video_url = video_url "amp;autohide=1amp;modestbranding=1amp;showinfo=0amp;theme=light";
    $(this).find('embed').attr('src', new_video_url);
    $(this).find('param:eq(0)').val(new_video_url);
    $(this).find('embed').before('<param name="autoplay" value="1"><param name="showinfo" value="1"><param name="modestbranding" value="1"><param name="hd" value="1"><param name="color" value="white"><param name="autohide" value="1">');
});
 

Вот как выглядел код до jQuery:

 <object width="500" height="371">
    <param name="movie" value="http://www.youtube.com/v/ISeQBRUa8xQamp;amp;rel=0amp;amp;egm=0amp;amp;showinfo=0amp;amp;fs=1">
    <param name="wmode" value="transparent">
    <param name="allowFullScreen" value="true">
    <embed 
        src="http://www.youtube.com/v/ISeQBRUa8xQamp;amp;rel=0amp;amp;egm=0amp;amp;showinfo=0amp;amp;fs=1" 
        type="application/x-shockwave-flash" 
        width="500" 
        height="371" 
        allowfullscreen="true" 
        mode="transparent"
    >
</object>
 

Вот как это выглядит после выполнения jquery.

 <object width="500" height="371">
    <param name="movie" value="http://www.youtube.com/v/ISeQBRUa8xQamp;rel=0amp;egm=0amp;showinfo=0amp;fs=1amp;autohide=1amp;modestbranding=1amp;showinfo=0amp;theme=light">
    <param name="wmode" value="transparent">
    <param name="allowFullScreen" value="true">
    <param name="autoplay" value="1">
    <param name="showinfo" value="1">
    <param name="modestbranding" value="1">
    <param name="hd" value="1">
    <param name="color" value="white">
    <param name="autohide" value="1">
    <embed 
        src="http://www.youtube.com/v/ISeQBRUa8xQamp;rel=0amp;egm=0amp;showinfo=0amp;fs=1amp;autohide=1amp;modestbranding=1amp;showinfo=0amp;theme=light" 
        type="application/x-shockwave-flash" 
        width="500" 
        height="371" 
        allowfullscreen="true" 
        wmode="transparent"
        >
</object>
 

Несмотря на то, что HTML-код был успешно изменен, при отображении страницы обновленный код не отображается.

Вот jsFiddle, подтверждающий проблему: http://jsfiddle.net/4kQYy/4 /

Если вы просмотрите второе видео YouTube в своем инспекторе, вы увидите, что на самом деле код вводится на 100% правильно, но рендеринг страницы не отражает обновление. Как это может быть? Конечно, то, что вы видите в исходном коде, — это то, что вы видите на экране? Помогите!

Я не эксперт по flash, но моя логика говорит, что то, что вы пытаетесь сделать, может не сработать. Что происходит, на мой взгляд, следующие шаги:

1. Вы инициализируете экземпляр flash
2. При инициализации флэш-ролик получает параметры и действует соответствующим образом
3. После этого вы меняете параметры, которые больше не влияют на флэш-фильм

Что вы могли бы сделать, это либо переместить весь процесс создания экземпляра flash в javascript. Это означает, что вы генерируете весь тег объекта. Или вы отсоединяете тег object, вносите свои настройки и снова вставляете его. Я обновил код в вашей скрипке

 $("#foobar").each(function(){
    var parent = $(this).parent(),
        object = $(this).detach()

    video_url  = object.find('embed').attr('src');
    new_video_url = video_url "amp;autohide=1amp;modestbranding=1amp;showinfo=0amp;theme=light";
    object.find('embed').attr('src', new_video_url);
    object.find('param:eq(0)').val(new_video_url);
    object.find('embed').before('<param name="autoplay" value="1"><param name="showinfo" value="1"><param name="modestbranding" value="1"><param name="hd" value="1"><param name="color" value="white"><param name="autohide" value="1">');
    parent.append(object);
});
 

Я знаю, что это работает не во всех условиях, особенно если у родителя более одного дочернего элемента, но это должно дать вам общее представление.