Change the contents of a div using a select

0

How to change content of a div using a select?

I have a div with two images that I want when selecting an element of select change the two images of the div for two others, or for one. I do not remember how to do it or I just do not know.

    
asked by Antonio Cabrera 02.03.2018 в 03:40
source

1 answer

1

This could be an example in basic javascript of what you are looking for and that you can mold adapting it to your needs.

document.getElementById('miSelect').onchange = function(event){  
  document.getElementById('miImagen').src = document.getElementById('miSelect').value;
}
img{
width: 200px;
height: 200px;
}
<img id="miImagen" src="http://support.yumpu.com/en/wp-content/themes/qaengine/img/default-thumbnail.jpg">
<select id="miSelect">
  <option value="http://support.yumpu.com/en/wp-content/themes/qaengine/img/default-thumbnail.jpg" selected>Sin imagen</option>
  <option value="https://pbs.twimg.com/profile_images/723561620761391104/BQmg7aTz_400x400.jpg">Imagen 1</option>
  <option value="http://www.clker.com/cliparts/v/N/K/k/N/3/number-2-design-md.png">Imagen 2</option>
</select>
  
    
answered by 02.03.2018 в 10:21