I want to use the same script from different input buttons on the page, loading different iframes.
I am able to pass the Button Id and the Button Value to the function.
BUT how do I pass the Frame Name to the function?
My code is working but only for one iframe named “frame1”:
<input type="button" class="btn btn-default" value="Grindarna" id="myButton1" onClick="changetext('myButton1','Grindarna','frame1')">
<div class="iframes">
<iframe name="frame1" allowfullscreen style="display: none" frameborder="1" height="230" width=700px src="../texter/byggnader-herrgarden-info.htm" target="_blank"></iframe>
</div>
<script>
function changetext(Butto, KnappText, FrameN)
{
var elem = document.getElementById(Butto);
if (elem.value==KnappText)
{
elem.value = "Stäng";
const el = document.querySelector('.iframes [name=frame1]');
el.style.display = el.style.display === 'block' ? '' : 'block';
}
else
{
elem.value = KnappText;
const el = document.querySelector('.iframes [name=frame1]');
el.style.display = el.style.display === 'none' ? '' : 'none';
}
}
</script>
Save space and use one <iframe> that multiple <a>nchors can open. For each link assign a different url to their href and assign the <iframe> name to each link’s target attribute.
<a hfre="https://example.com" target="frame">EXAMPLE</a>
<iframe name="frame"></iframe>
<a href="https://example.com" target="frame">EXAMPLE</a>
<a href="https://m.google.com/" target="frame">GOOGLE - MOBILE</a>
<a href="https://www.amp-what.com/" target="frame">AMP-WHAT</a>
<iframe name="frame"></iframe>2