Question

I having problems with a script to change an image on a page based on a option selected from a drop down menu. I can make it work when I have one drop down changing one image. But I’m trying to expand my code so that I can replace two images from a single drop down menu and I’m not really sure what is wrong with my code.

<script>
window.onload=function()
{

    bp='http://www.nessasneedles.co.uk/images/layout/shop/samples/fabric/', //base url     of your images
    imgnum=4, //Number of your images. This should match on your comboboxes options.
    thumb1=document.getElementById('outer_example'), //id of your outer image that will     be changing. The outer of the bag
    thumb2=document.getElementById('lining_example'), //id of the image using in the if     clause for second image
    combobox1=document.getElementById('outer_option'), // id of your combobox. The     select box for the outer design.

    combobox1.onchange=function()
    {
    thumb1.src=bp+'img'+this.value+'.jpg';
    
    if (this.value = "Cats") {
        thumb2.src=bp+'img'+"Purple Gingham"+'.jpg';
    } else {
        thumb2.src=bp+'img'+"Pink"+'.jpg';
        };    
    };
        

}
</script>

Answer 1

You need a double == in your if statement:

if (this.value == "Cats") {

Single = for assigning a value, double == for comparison.