How to display html file in iframe using javascript

Question

i have here a catalogue code that I want to display the index.html file of the value to the iframe. it returns me "Page can't be displayed". Only HTML and Javascript must be used in this code.

<script>
function display() {
var cake = document.getElementById("type").value;
document.getElementById('cakes').src = cake + '\index.html';
}
</script>
    </head>
<body>
<center><img src="LOGO.jpg" size=20%></img></center>
<p><center><font face="Brush Script MT" size="32" color="lightblue" valign=middle>YOU'RE SO SWEETS</font></center></p>
<table valign=center>
<tr>
<td><img src="home.png"></td>
<td><img src="product.png"></td>
<td><img src="online.png"></td>
<td><img src="about.png"></td>
<td><img src="contact.png"></td>
</tr>
</table>
<br>
<select id="type" multiple onchange="display()">
<option value="special">Specialty Cakes</option>
<option value="adult">Birthday Cakes for Adult</option>
<option value="kids">Birthday Cakes for Kids</option>
<option value="wedding">Wedding Cakes</option>
</select>
<br>
<iframe id="cakes" src=""></iframe>

Answer 1

Assuming that your logic and path definitions are correct, you'll need to use a forward slash ( / ), rather than a backslash as follows:

document.getElementById('cakes').src = cake + '/index.html';

Please also ensure that the files are located in the same directory as your HTML file, so the structure should be:

main.html
special/
- index.html
adult/
- index.html
kids/
- index.html
wedding/
- index.html

How to display html file in iframe using javascript

Question

1 answers

solution1
1 ACCPTED 2014-10-19 09:34:19

How to display html file in iframe using javascript

Question

1 answers

solution1 1 ACCPTED 2014-10-19 09:34:19

solution1
1 ACCPTED 2014-10-19 09:34:19