Apertura vari links sullo stesso iframe

[totobets]

Buongiorno Community, ho un "problema" da risolvere sicuramente facile per voi
Sto creando un app in Jquery Mobile e sono a buon punto ma come tutti i programmatori amo perfezionarla.
Ho creato un Pannello laterale dove alla sua apertura ci sono vari link tramite una "listview" che puntano alle aperture esterne di vari siti web:
codice:

---

<!-- Pannello di sinistra [MENU] -->
<div data-role="panel" data-position-fixed="true" data-display="overlay" data-theme="b" id="left-panel">
<ul data-role="listview">
<li style="text-align:center">M E N U' &ensp;&ensp;P R I N C I P A L E</li>
<li><a href="http://m.tuttosport.com/?cookieAccept" target="_top" class="ui-nodisc-icon"><i class="fa fa-desktop" aria-hidden="true"></i> TuttoSport � Web</a></li>
<li><a href="http://www.gazzetta.it/?refresh_ce-cp" target="_top" class="ui-nodisc-icon"><i class="fa fa-desktop" aria-hidden="true"></i> Gazzetta dello Sport � Web</a></li>
<li><a href="http://m.corrieredellosport.it/?cookieAccept" target="_top" class="ui-nodisc-icon"><i class="fa fa-desktop" aria-hidden="true"></i> Corriere dello Sport � Web</a></li>
</ul>
</div><!-- /panel -->

---

vorrei fare in modo che alla scelta del link venga aperta una pagina interna (sempre la stessa) con all'interno un iframe con SRC del link selezionato... una sorta del genere:
codice:

---

<!-- Pagina Esterna -->
<div data-role="page" id="PaginaEsterna">
<div data-role="header" data-position="fixed" data-theme="a">
<h1 style="text-shadow: 1px 1px 4px #888">.:: Web Site ::.</h1>
<a href="#home" class="ui-btn ui-shadow ui-corner-all ui-icon-home ui-btn-icon-notext">Home</a>
<button onClick="document.location.reload(true)" class="ui-btn ui-shadow ui-corner-all ui-icon-refresh ui-btn-icon-right ui-btn-icon-notext">Refresh</button>
<!-- <button onclick="var ifr=document.getElementsByName('refresh')[0];ifr.src=ifr.src" class="ui-btn ui-shadow ui-corner-all ui-icon-refresh ui-btn-icon-right ui-btn-icon-notext">Refresh</button -->
</div><!-- /header -->

<div role="main" class="ui-content jqm-content jqm-fullwidth" style="overflow: visible; overflow-x: scroll">

<iframe src=" " width="100%" height="750px" scrolling="auto" frameborder="0"></iframe>

</div><!-- /content -->
</div><!-- /page -->

---

Quindi far puntare dal link la pagina interna e inserire una sorta di ID sul link da riportare sull'IFRAME o una cosa del genere:
codice:

---

<li><a href="#PaginaEsterna" id="http://m.tuttosport.com/?cookieAccept" target="_top" class="ui-nodisc-icon"><i class="fa fa-desktop" aria-hidden="true"></i> TuttoSport � Web</a></li>

......
......
......

<iframe ID=" " width="100%" height="750px" scrolling="auto" frameborder="0"></iframe>

---

HELP

[cavicchiandrea]

<a href="#paginaesterna" onclick="document.getElementById('idtuoiframe').sr c='urlestero'>...</a> se non funziona boh....

[totobets]

Non va... credo che ci sia qualche errore nelle virgolette di chiusure. Potresti essere più preciso per favore. Ti ringrazio per la risposta precedente

[cavicchiandrea]

<a href="#paginaesterna" onclick="document.getElementById('idtuoiframe').src='urlestero'">...</a>

[totobets]

grazie

[totobets]

buongiorno ragazzi, riprendendo in progetto del mio vecchio sito volevo riaprire questa discussione se era possibile. La soluzione data a suo tempo dal moderatore CavicchiAndrea confermo che era ed è perfetta. se era possibile volevo risolvere solo una cosa che a livello estetico è un po antipatica. Vengo al dunque :all'apertura del primo link tutto ok ma poi se si torna alla home e si aproin seguito altri link che rimandano al tag iframe questa finestra si apre per qualche secondo con il link/iframe precedente per poi passare 'caricare' la pagina nuova. come posso evitare questa cosa? ho cercato qqualcosa per ripulire iframe ma nn so se sia questa la soluzione.