Open links in iframe one by one when button is pressed
P粉949848849
2023-09-03 15:44:43
<p>I have an array with three links for a button used in the footer and when I press the button again and again the array works fine one by one. . And a link button will appear every time it is pressed. That's fine.
But I want, when I click the button, <em> the "link" should open in an "iframe"</em>. . . I used iframe code to pass them src= button id but it doesn't work. . Please provide the code below and help. .
.
My button code with array</p>
<pre class="brush:php;toolbar:false;"><!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
. footer {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
background-color: red;
color: white;
text-align: center;
}
</style>
<script>
let link = new Array()
link[0] = "https://www. clc-uk. org. uk/cms/cms. jsp?menu_id=26131&postcode=AL3 8QE&distance=20"
link[1] = "https://www. clc-uk. org. uk/cms/cms. jsp?menu_id=26131&postcode=AL5 3NG&distance=20"
link[2] = "https://www. clc-uk. org. uk/cms/cms. jsp?menu_id=26131&postcode=AL4 3NS&distance=20"
let intlinkIndex = 0;
function writeLink() {
if (intlinkIndex >= link. length) {
let btn = document. getElementById('btn');
btn. style. display = 'none';
mylink. style. display = 'none';
}
document. getElementById('mylink'). innerHTML = '<a href="' link[intlinkIndex] '">' link[intlinkIndex] '</a>';
intlinkIndex;
}
</script>
</head>
<body>
<div class="footer">
<button id="btn" onclick="writeLink();">Click Me</button>
<div id="mylink"></div>
<br>
<iframe id="iframe" src="mylink" width="100%" height="400"></iframe>
</div>
</body>
</html></pre></p>
When generating the link's HTML, you can obtain it by specifying the name of the iframe in
target
.So add a
name
attribute to your iframe like this:Then add a
target
attribute.Complete source code