选择Javascript和HTML选项时如何更改图像_Javascript_Html

选择Javascript和HTML选项时如何更改图像

javascript html

选择Javascript和HTML选项时如何更改图像,javascript,html,Javascript,Html,我对选择选项时如何显示图片感到困惑。例如，我从HTML中的选项中选择Spring，它应该从外部源Javascript链接。一幅画应该是春天的图画。我尝试过使用if语句，如果value=Spring，则会出现一个图像 <html> <body> <img src="" name="changepic"> <select name="allseasons" id="allseasons">

我对选择选项时如何显示图片感到困惑。例如，我从HTML中的选项中选择Spring，它应该从外部源Javascript链接。一幅画应该是春天的图画。我尝试过使用if语句，如果value=Spring，则会出现一个图像

    <html>
    <body>
        <img src="" name="changepic">
        <select name="allseasons" id="allseasons">
            <option value="Spring">Spring</option>
            <option value="Summer">Summer</option>
            <option value="Fall">Fall</option>
            <option value="Winter">Winter</option>
        </select>
    </body>
    </html>

Javascript

element=document.getElementById('allseasons');
if (value =="spring");
    element.src="spring.jpg"
if (value =="summer"); 
    element.src="summer.jpg"
if (value =="fall"); 
    element.src="fall.jpg"
if (value =="winter"); 
    element.src="winter.jpg"
}

您应该将事件侦听器附加到其次，您应该将src存储在的值中，这样就不需要检查每个src。不要放；在if语句的末尾。它将始终运行它下面的代码，条件为true或false const元素=document.querySelector'changepic'； console.logelement； document.querySelector'allseasons'。addEventListener'change'，e=>{ element.src=e.target.value； console.logelement； } 春天夏天落下冬天

一等于一。两个比较。三个用于类型比较。您需要if value==spring或if value==spring。另外，else条件没有括号，将抛出语法错误。