<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>灯泡开关</title>
</head>
<body>
<img id ='off' src="img/off.gif" >
<script>
var l1=document.getElementById("off")
function fun(){
var flag=false;
if(flag){
l1.src="img/off.gif";
alert(flag);
}
else {
l1.src="img/on.gif";
flag=true;
// alert(flag)
}
}
l1.onclick=fun;
</script>
</body>
</html>
判断语句能执行到flag=true但是就是不能跳到第一个if语句是怎么回事呢
我觉得你的那个var flag=false;应该定义再fun函数外部
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<title>Document</title>
</head>
<body>
<!-- <img id ='off' src="img/off.gif" > -->
<div id ="off" style="background-color:black;padding: 10px;width: 50px;margin: 0 auto;"></div>
<script>
var op = false;
var l1=document.getElementById("off");
l1.onclick=fun;
function fun(){
if(op){
//l1.src="img/off.gif";
l1.style.backgroundColor="black";
op= false;
}
else {
//l1.src="img/on.gif";
l1.style.backgroundColor="green";
op= true;
}
}
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>灯泡开关</title>
</head>
<body>
<img id ='off' src="img/off.gif" >
<script>
var l1=document.getElementById("off")
var flag=false;
function fun(){
if(flag){
l1.src="img/off.gif";
alert(flag);
}
else {
l1.src="img/on.gif";
flag=true;
// alert(flag)
}
}
l1.onclick=fun;
</script>
</body>
</html>
var flag=false;你定义在了函数内部,那么每次你调用这个函数时,都会先给flag赋值为false,你的if判定永远都会走else,执行else后虽然flag会被赋值为true,但是当你再次点击时又会先执行var flag=false,那么就又会走else,所以应该将var flag=false;定义在函数外部,而不是内部。