I have a code that receives the value drop-down list and displays a picture, the path of which is specified in the value each item in the list. Now it became necessary to display another html document, and it wasn’t easy to replace <img> with <iframe> . Members, help please. JS is weak for now. Here is the code that I use to display the image.

 <img id="img" src="value" align="middle" /> <script> var select = document.getElementById('categories'), img = document.getElementById('img'); select.addEventListener('change', changeImg.bind(this),false) function changeImg(elem) { img.src = elem.target.value } </script>

  • Changed img to iframe , no problems, what's the problem? - KRasul
  • I will give the code in the answer - KRasul

1 answer 1

Everything is simple:

 <select id="categories"> <option>Выберите из списка</option> <option value="http://site.com/">site.com</option> <option value="http://site.com/">site.com</option> </select> <iframe id="iframe" src="value" align="middle"></iframe> <script> var select = document.getElementById('categories'), iframe = document.getElementById('iframe'); select.addEventListener('change', changeImg.bind(this),false) function changeImg(elem) { iframe.src = elem.target.value } </script>

The main thing is that in the headers of the site that will be displayed in the iframe there was no X-Frame-Options: DENY

  • Thanks, it turned out everything is simple) Initially, I did not think of it, apparently fatigue takes its toll - ilya1099
  • We must rest, of course) - KRasul