CODEWITHSUNDEEP
javascriptjqueryflashyoutube
Alex
Alex

Reputation: 68450

Modifying iframe URL with jQuery

How can I modify the URL of an iframe, if it contains the youtube.com text?

I want to append:

&wmode=Opaque

to it, but only if this argument doesn't already exist;

Tried:

$('iframe[src*=youtube.com]').attr('src',
   $(this).attr('src') + '&wmode=Opaque');`

but I get an error:

Uncaught Error: Syntax error, unrecognized expression: [src*=youtube.com]

ok, I found out:

$('iframe[src*="youtube.com"]').each(function(){
  this.src += '&wmode=Opaque';
});

Upvotes: 2

Views: 740

Answers (2)

Luca Borrione
Luca Borrione

Reputation: 16992

I would do it in this way:

<script type="text/javascript">

    function $_GET(key, src)
    {
        var re = new RegExp('[&|?]'+ key +'=([^&]*)','i');
        return (src = src.replace(/^\?/,'&').match(re)) ? src=src[1] : src='';
    }

    function appendToIframe(id, key, value)
    {
        var iframe = document.getElementById(id);
        var src = iframe.src;

        // Append desired key and value if key doesn't exist
        if (!$_GET(key, src))
        {
            var glue = (src.indexOf('?') == -1) ? '?' : '&';
            src += glue + key +'='+ value
        }

        iframe.src = src;           
    }


    </script>

<iframe src="your_url" id="iframeID"></iframe>

<a href="#" onclick="appendToIframe('iframeID', 'wmode', 'Opaque'); return false;">APPEND</a>

Just change src and id of the iframe tag as desired, and then use the function appendToIframe to append a new couple of key and value to the iframe URL only if key is not already present.

Please note that jQuery is not needed for that.

Upvotes: 1

Joep
Joep

Reputation: 651

According to the jQuery API you want to do this:

$('iframe[src*=youtube.com]').attr('src',$(this).attr('src') + '&amp;wmode=Opaque');
$('iframe[src*="youtube.com"]').attr('src',$(this).attr('src') + '&amp;wmode=Opaque');

Note the double quotes around 'youtube.com'.

Upvotes: 1

Related Questions