Make IFRAME or EMBED dynamic get attribute of the clicked link

Navigation
0

Which way an IFRAME or EMBED can be dynamically created with a HREF attribute clicked at that moment, opening > object with its URL of that link on which it was clicked.

Code 

<body>
 <a href="http://pt.stackoverflow.com/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>
  

Does anyone have any idea how to achieve this?

    
asked by anonymous 07.06.2016 / 18:18

2 answers

1

Do this: 

<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 want to keep substituting: 

<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>
    
07.06.2016 / 18:44
0

Okay! @Miguel. I also have another alternative to make% dynamic% load the attribute <iframe/> of the link. It occurred to me in the thought line to replace the attribute href for the attribute src of name . A little change and see the result 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.br" target="id">google</a>
<hr>
<span id="exibir"></span>

Now for the <iframe/> also created dynamically, I have completely re-scripted it to work 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>
  

Please note that both results will undergo some significant or significant modification.

The rest for me was satisfactory, now I hope this doubt or function helps someone else.

    
07.06.2016 / 19:35
Error starting project with zend Framework ReactJS + Angular + Babel