老师帮我看看哪里写的不对

老师帮我看看哪里写的不对

<!DOCTYPE html><html>    <head lang="en">        <meta charset="UTF-8">        <title>onchange()</title>        <style type="text/css">            #div{                width:300px;                height:300px;                border:2px solid gray;                margin:100px  0  0 200px;            }        </style>        <script type="text/javascript">           //补充代码           window.onload=function(){               var color=document.getElementById('color');               var div=document.getElementById('div');
               color.onchange=function(){                    if(this.value=='0'){                        div.style.backgroundColor="white";                        div.innerText="我没有发生任何变化";                    }else{                        div.style.backgroundColor=this.value;                        div.innerText='我的背景颜色变成了'+this.value+'色';                    }               }        </script>    </head>    <body>        <div>            <span>请选择您喜欢的颜色:</span>            <select id="color">                <option value="0">请选择</option>                <option value="yellow">黄色</option>                <option value="orange">橘色</option>                <option value="pink">粉色</option>                <option value="purple">紫色</option>            </select>        </div>        <div id="div">我是div</div> </body></html>

正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

2回答
好帮手慕星星 2021-07-10 10:03:10

同学你好,意思是直接写value属性吗?

http://img1.sycdn.imooc.com//climg/60e8ff5e096dea5c06780112.jpg

如果这样写value是变量,而前面并没有定义此变量,就会报错

http://img1.sycdn.imooc.com//climg/60e8ff7f09295cf204470035.jpg

所以获取下拉框值,可以用select.value ,当前代码也就是color.value

http://img1.sycdn.imooc.com//climg/60e8ffc00903d10406440086.jpg

onchange事件绑定在color上,所以这里可以用this,也就是this.color 。

祝学习愉快!

好帮手慕久久 2021-07-01 13:35:06

同学你好,js代码缺少一个“}”,导致结构不对,所以没效果。修改如下:

http://img1.sycdn.imooc.com//climg/60dd53f109d9aecd08390442.jpg

祝学习愉快!

  • 提问者 神知 #1

    div.style.backgroundColor=this.value;

    ​div.innerText='我的背景颜色变成了'+this.value+'色';

    老师这里为什么写value不是color


    2021-07-09 19:35:16
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师