Javascript jquery 四个div，点击变换不同颜色，如果颜色全部变执行某个函数。

Question

四个div，点击变换不同颜色，如果颜色全部变了执行某个函数。思路是怎样的呢
$(".suo").each(function(i){
if(i==0){
$(this).click(function(){
$(this).css("background","yellow");
$(this).data("data","change");
});
}
if(i==1){
$(this).click(function(){
$(this).css("background","green");
$(this).data("data","change");
});
}
if(i==2){
$(this).click(function(){
$(this).css("background","#0066cc");
$(this).data("data","change");
});
}
if(i==3){
$(this).click(function(){
$(this).css("background","#666");
$(this).data("data","change");
});
}
});

Answer 1

<script>
$(document).ready(function () {
$("#red").on("click", function () {
$(this).css("background-color", "red");
$("#body").trigger("changeColorEvent" );
});
$("#green").on("click", function () {
$(this).css("background-color", "green");
$("#body").trigger("changeColorEvent");
});
$("#blue").on("click", function () {
$(this).css("background-color", "blue");
$("#body").trigger("changeColorEvent");
});
$("#yellow").on("click", function () {
$(this).css("background-color", "yellow");
$("#body").trigger("changeColorEvent");
});

$("#body").on("changeColorEvent", function (event) {
var number = parseInt($("#changeNumber").val()) + 1;
if (number == 4) {
$("div").removeAttr("style");
$("#changeNumber").val(0);
} else {
$("#changeNumber").val(number);
}

});
});
</script>
<div id="body">
<div id="red">1</div>
<div id="green">2</div>
<div id="blue">3</div>
<div id="yellow">4</div>
</div>
<input type="hidden" id="changeNumber" value="0" />

-------------------------------------
$("div").removeAttr("style"); 这段可以改成你想要的代码

追问

不行啊，一个div点四次也可以消失。。。。

追答

var flag = ["red", "green", "blue", "yellow"];
$(document).ready(function () {
$("#red").on("click", function () {
$(this).css("background-color", "red");
$("#body").trigger("changeColorEvent", $(this).attr('id'));
});
$("#body").on("changeColorEvent", function (event,id) {
if (flag != undefined && flag != "" && jQuery.inArray(id, flag)>=0) {
flag.splice(jQuery.inArray(id, flag), 1);
}
if (flag == "") {
$("div").removeAttr("style");
}
});
});

Answer 2

给四个div加一个onclick事件：比如有div1,div2,div3,div4 。 onclick="aaa('div1')"，aaa方法里面的参数就是每个层的id属性。
function方法如下：
function aaa(div){
if(div=="div1")
$("#"+div).attr("background","blue");

else if(div=="div2")
$("#"+div).attr("background","red");
else if(div=="div3")
...............

}

Answer 3

给4个div绑定 点击事件，然后用if ....else判断

Answer 4

加判断，if,,

追问

能详细点么

追答

在四个变色方法加入boolean，，，变了就true....最后判断，四个全是ture就执行方法