Jquery to insert src attribute of iframes to be their respective id's

I am trying to dynamically add the src attribute to iframes, taken from their respective id's.

Here is what I am working with (using improper use of 'this' but you should get what I am trying to do.)

$(this).parent().find("iframe").attr('src', http://www.youtube.com/embed/" + $(this).attr('id'));

my iframe code looks something like this:

<iframe id = "XpOPKZB8dgY" src=""></iframe>

some more context if it helps:

<script>    
    $(document).ready(function() {
        $("iframe").attr('src', '');   
        $(".details").slideUp();   
     开发者_运维技巧   $("a.date").click(function() {   
            var key = $(this).parent().attr('class');  
            $(this).parent().children("div").slideToggle('slow');    
            $(this).parent().find("iframe").attr('src', "http://www.youtube.com/embed/" + $(this).attr('id');                    
            $(document.body).animate({    
                'scrollTop':   $(this).offset().top    
            },   1000);    
        });  
    });

</script>

Thanks!

---

You could do it like this:

$(this).parent().find("iframe").each(function(i) {
    var src = 'http://www.youtube.com/embed/' + $(this).attr('id')
    $(this).attr('src', src);
});

---

First of all, you need to fix your jQuery, your just missing a quotation mark:

$(this).parent().find("iframe").attr('src', "http://www.youtube.com/embed/" + $(this).attr('id'));

Then I would try executing this JavaScript, once you have reassigned the src value to the iFrame:

document.getElementById('XpOPKZB8dgY').contentWindow.location.reload();

I didn't test this, but it should work. :)

Hope that helps,
spryno724

---

http://jsfiddle.net/THnTb/

    $("iframe").each(function() {
        $(this).attr('src', 'http://www.youtube.com/embed/' + $(this).attr('id'));
    });

---

You are missing the closing parenthesis on the line you apply the src back to the iframe. Also pulling the id from the iframe might require the same syntax as applying src.

    $(document).ready(function() {
        $("iframe").attr('src', '');   
        $(".details").slideUp();   
        $("a.date").click(function() {   
            var key = $(this).parent().attr('class');  
            $(this).parent().children("div").slideToggle('slow'); 

            var newSrc = "http://www.youtube.com/embed/" + 
              $(this).parent().find("iframe").attr('id'); 

            $(this).parent()
              .find("iframe")
              .attr(
                'src', newSrc 
               ); // << Missing Here                    
            $(document.body).animate({    
                'scrollTop':   $(this).offset().top    
            },   1000);    
        });  
    });

---

I think you're not refering to the iframe id, you need to refer to it, the same way you already did to set the src attribute:

$(this).parent().find("iframe").attr('src', "http://www.youtube.com/embed/" + $(this).parent().find("iframe").attr('id'));