5

这是我的代码：

$(val1).mouseleave(function () {
    flag = false;
    $(val3 + "," + val4).mouseenter(function () {

        flag = true;
        //alert(flag);

    });
    if (flag == true) {
        //alert("if"+flag);
        $(".big" + i + j + "boxer").show();
        $(".big" + i + "box").show();
        $(".big" + i + "box").append('<div class="opacity" style="background-color:rgba(00,00,00,0.77);position:absolute;top:0;right:0;left:0;bottom:0;"></div>')
        $(".small" + i + "box").append('<div class="opacity" style="background-color:rgba(00,00,00,0.77);position:absolute;top:0;right:0;left:0;bottom:0;"></div>')

    } else {
        //alert("else"+flag);
        $('.opacity').remove();
        $(val2).hide();
        $(val3).show();

    }
});

不符合flag = true条件。如果我alert在里面$(val1).mouseleave(function(){});，就说明 flag = true；但是当我在外面提醒它时$(val1).mouseleave(function(){});，它会显示flag = false。

好吧，让我解释一下：我有 4 个块val1,val2,val3和val4. 当用户离开val1并进入val3或val4阻止时，我想set/add opacity class......如果他们do not enter进入val3/val4但进入阻止，val2 or another block那么我想删除不透明度类。

4

3 回答 3

8

在您进行 if 测试时：

if(flag==true)

...flag将始终为假，因为您将其设置为false就在此之前。它设置到的唯一位置true是在您绑定的处理程序内部mouseenter，但此时不会调用该处理程序函数。

让我在代码的开头添加一些注释以使代码更清晰：

$(val1).mouseleave(function () {
    flag = false;                                  // set flag to false
    $(val3 + "," + val4).mouseenter(function () {  // bind a mouseenter
        flag = true;                               // that won't be called immediately
        //alert(flag);                             // so won't change flag yet
    });
    if (flag == true) {                            // flag is still false

mouseenter从处理程序内部绑定处理程序是没有意义的mouseleave，因为这意味着每次 mouseleave 发生时，您都会将其他mouseenter处理程序绑定到相同的元素。

我不能真正建议一个具体的解决方案，因为你还没有解释你想要达到的效果。（但我可能会先将该mouseenter代码移到其他地方。）

于 2013-07-02T11:30:22.493 回答
1 
$(val1).mouseleave(function () {
    flag = false;
    $(val3 + "," + val4).mouseenter(function () {

        flag = true;
        //alert(flag);
        if (flag == true) {
        //alert("if"+flag);
        $(".big" + i + j + "boxer").show();
        $(".big" + i + "box").show();
        $(".big" + i + "box").append('<div class="opacity" style="background-color:rgba(00,00,00,0.77);position:absolute;top:0;right:0;left:0;bottom:0;"></div>')
        $(".small" + i + "box").append('<div class="opacity" style="background-color:rgba(00,00,00,0.77);position:absolute;top:0;right:0;left:0;bottom:0;"></div>')

    } else {
        //alert("else"+flag);
        $('.opacity').remove();
        $(val2).hide();
        $(val3).show();

    }

    });

});
于 2013-07-02T11:56:13.190 回答
1

既然你已经明确了你的目标，我认为这样的事情会起作用：

var haveLeft = null;    

$(val1).mouseleave(function () {
    haveLeft = "val1";
});

$(val2).mouseenter(function () {
    if(haveLeft === "val1") {
        // remove opacity class
    }        
}).mouseleave(function(){
    haveLeft = "val2";
});

$(val3 + "," + val4).mouseenter(function () {
    if(haveLeft === "val1") {
        // add opacity class
    }
}).mouseleave(function(){
    haveLeft = "val3/4";
});
于 2013-07-02T12:08:28.793 回答