javascript点击事件为什么要点击两次才触发?
<divclass="box"><h1>1.点击按键修改样式</h1><inputtype="button"value="修改样式"id="ck"/></div><scr...
<div class="box">
<h1>1.点击按键修改样式</h1>
<input type="button" value="修改样式" id="ck"/>
</div>
<script>
window.onload=function(){
var oBox=document.getElementsByClassName('box')[0];
document.getElementById('ck').onclick=function(){
if(oBox.style.width === '100%'){
oBox.style.background='yellow';
oBox.style.width='50%';
}
else{
oBox.style.background="";
oBox.style.width='100%';
}
};
} 展开
<h1>1.点击按键修改样式</h1>
<input type="button" value="修改样式" id="ck"/>
</div>
<script>
window.onload=function(){
var oBox=document.getElementsByClassName('box')[0];
document.getElementById('ck').onclick=function(){
if(oBox.style.width === '100%'){
oBox.style.background='yellow';
oBox.style.width='50%';
}
else{
oBox.style.background="";
oBox.style.width='100%';
}
};
} 展开
3个回答
展开全部
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
#box{
width: 100%;
}
</style>
</head>
<body>
<div id="box">
<h1>1.点击按键修改样式</h1>
<input type="button" value="修改样式" id="ck"/>
</div>
<script>
var box=document.getElementById("box");
var ck=document.getElementById("ck");
var x=true;
ck.onclick=function(){
if(x){
box.style.width="50%";
box.style.backgroundColor="yellow";
x=false;
}else{
box.style.width="100%";
box.style.backgroundColor="red";
x=true;
}
}
</script>
</body>
</html>
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
2017-05-27
展开全部
第一次触发的else 设置oBox.style.width='100%';
第二次才满足 改变颜色
第二次才满足 改变颜色
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
你的判断有问题把,oBox.style.width === '100%'这个不应该这样判断。
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询