Make IFRAME or EMBED dynamically pick attribute of clicked link

Asked

Viewed 905 times

0

What way a IFRAME or EMBED can be dynamically created with HREF clicked at that given moment, opening the object with its URL of that link on which it was triggered via mouse click.

Code

<body>
 <a href="/questions/ask" onclick="abrir(this.href); return false;">Clique</a>
  <hr>
 <span id="exibir"></span>
</body>

<script language="JavaScript">

function abrir(URL) {
obj = document.createElement("embed");
obj.setAttribute("src","'+URL+'");
obj.style.width = 240+"px";
obj.style.height = 180+"px";
document.getElementById('exibir').appendChild(obj);
}
</script>

It remains to make the script capture the setAttribute’s <a href='http://answall.com'> moving on to the setAttribute("src",""); indexing it in the "src","".

Does anyone have any idea how to get this?

javascript

2 answers

1


Do so:

<a href="http://www.bbc.com/news/" onclick="abrir(this);return false;">Clique</a>
<a href="http://www.abola.pt/" onclick="abrir(this);return false;">Clique</a>
<a href="http://www.usatoday.com/" onclick="abrir(this);return false;">Clique</a>

<script>
    function abrir(ele) {
        var iframe = document.createElement('iframe');
        iframe.src = ele.href;
        iframe.width = 240;
        iframe.height = 180;
        document.body.appendChild(iframe);
    }
</script>

Or if you always want to replace:

<a href="http://www.bbc.com/news/" onclick="abrir(this);return false;">Clique</a>
<a href="http://www.abola.pt/" onclick="abrir(this);return false;">Clique</a>
<a href="http://www.usatoday.com/" onclick="abrir(this);return false;">Clique</a>

<script>
    function abrir(ele) {
        var elem = document.getElementById('dinamic_iframe');
        if(elem !== null) { // remover caso exista
            elem.remove();
        }
        var iframe = document.createElement('iframe');
        iframe.src = ele.href;
        iframe.id = 'dinamic_iframe';
        iframe.width = 240;
        iframe.height = 180;
        document.body.appendChild(iframe);
    }
</script>

  • 1

    I was taking a look at the questions I’ve already asked here Sopt, and I noticed that I had not given the deserved Vow in this your answer. Forgive me for the distraction from not voting in time ago when I needed the answer. But anyway, you answered me then deserved it. rsrs

  • You’re welcome @Diegohenrique. Thank you

0

OK! @Miguel. I also bring another alternative to do the <iframe/> dynamically charge the attribute href of the link. It occurred to me in the line of thought to replace the attribute src to the attribute name of <iframe/>. A little exchange and see the result of it here:

window.onclick=function() {

document.getElementById('exibir').innerHTML='';

obj = document.createElement("iframe");
obj.setAttribute("name","id");
obj.style.width = 240+"px";
obj.style.height = 180+"px";
document.getElementById('exibir').appendChild(obj);
}
<a href="http://bing.com/?cc=br" target="id">bing</a> /
 
<a href="http://br.ask.com" target="id">ask</a> /

<a href="http://br.search.yahoo.com" target="id">yahoo</a> /

<a href="http://google.com" target="id">google</a>
<hr>
<span id="exibir"></span>

As for the <embed/> also dynamically created, redo the script completely so that it worked as expected. Check out:

function abrir(URL) {
document.getElementById("exibir").innerHTML = "<embed src='"+URL+"' type='application/mplayer' nocache='0' showcontrols='false' autostart='1' width='' height=''/>";
}
<a href="http://cache28.vuclip.com/53/65/5365756905f3dbd79909b3cce52649a3/ba63207/NiceGuys_5365_w_3.3gp" onclick="abrir(this.href); return false;">clic</a>
<hr>
<span id="exibir"></span>

Note that, both results will undergo some significant or significant modification.

Too much for me was satisfying, now I hope this doubt or function helps someone else.

  • Then you will add as many times as you click. You will always be adding to the page

Browser other questions tagged javascript

You are not signed in. Login or sign up in order to post.