当我更改第一个复选框时，我想更改 var theSame，但在 if(theSame == 1); 中它似乎没有改变
但它在 alert("b"+theSame) 中发生了变化。如何处理这个问题？
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
var theSame = 1;
$("input[name='thesame']").change(function(){
theSame = $(this).is(":checked") ? 1 : 0;
alert("a"+theSame);
});
if(theSame == 1){
$(".check_list input").change(function(){
alert("b"+theSame);
});
}
});
</script>
</head>
<body>
<input type="checkbox" name="thesame">same
<br>
<div class="check_list">
<input type="checkbox" name="son">ppp
<input type="checkbox" name="son">ppp
<input type="checkbox" name="son">ppp
</div>
</body>
</html>
谢谢，这就是我想要实现的目标:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$("input[name='thesame']").change(function(){
var theSame = this.checked ? 1 : 0;
show(theSame)
});
function show(i){
if(i == 1){
$(".check_list input").change(function(){
var inputName = $(this).attr("name");
$("input[name=" + inputName + "]").attr("checked",this.checked)
});
}else{
$(".check_list input").unbind("change")
}
}
});
</script>
</head>
<body>
<input type="checkbox" name="thesame" class="check-all">same
<br>
<div class="check_list">
<input type="checkbox" name="son">ppp
<input type="checkbox" name="sister">ppp
<input type="checkbox" name="dog">ppp
</div>
<hr>
<div class="check_list">
<input type="checkbox" name="son">ppp
<input type="checkbox" name="sister">ppp
<input type="checkbox" name="dog">ppp
</div>
<hr>
<div class="check_list">
<input type="checkbox" name="son">ppp
<input type="checkbox" name="sister">ppp
<input type="checkbox" name="dog">ppp
</div>
</body>
</html>
最佳答案
这实际上并不是范围问题，而是异步问题。让我们单步调试您的代码:
$(document).ready(function(){
// Define function-scope variable `theSame`, assign it a value of `1`
var theSame = 1;
// Bind a `change` event handler to an element, this function will run later!
$("input[name='thesame']").change(function(){
theSame = +this.checked;
alert("a"+theSame);
});
// At this point, `theSame` has not changed from its original value!
if(theSame == 1){
$(".check_list input").change(function(){
// Here, however, `theSame` may have had its value changed
alert("b"+theSame);
});
}
});
因此，正如您所看到的，当 if 语句运行时，它的值始终为 1，因为该值直到稍后才会更改，在此之后代码已经被执行。
如果将 if 语句移至事件处理程序内部，您将看到不同的结果:
$(".check_list input").change(function(){
if(theSame){
alert("b"+theSame);
}
});
在这里，只有当 theSame 为 1 时，您才会看到提醒。
关于javascript - 关于 JavaScript 中的作用域，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/8151122/