2

事情是这样的：

我想要一个jQuery函数，它允许我在以下任一情况下附加一个固定的弹出窗口：

  • A.)发生 mouseenter，之后 popUp 在随后的 mouseleave 上淡出并被删除，或者；
  • B.)当某个脚本特别调用它时，它会在指定时间后淡出并被删除。

应该不会太难，我想。然而，因为涉及到一个 fadeIn/Out()，所以有可能在第一个 popUp 真正消失之前调用另一个 popUp 的创建，从而以各种方式使整个事情变得混乱。那么问题来了：我如何设计一个函数来创建和管理其创建的元素而不会混淆它们？

现在，我想我会在附加的弹出窗口的 ID 中添加一个变量 ID 值，以便淡入/出调用仅适用于正确的调用，但这并不像我想要的那样工作，因为当 var增加var++；该函数永远不会操作 ID 值低于该 var 的 popUp。

到目前为止，我已经创建了以下格式的东西，我希望它能够正确说明我的想法：

var p1 = 0;
var p2 = 0;

function popUp(text, duration, targetLMN){

    if (duration  && !(targetLMN)) {

        $('body').append('<div id="popUpDur_'+p1+'" class="popUp" style="display:none;"> text </div>');

        // the following lines mess up as soon as another
        // popUp is created before the last one is gone.

        $('.popUpDur_'+p1).fadeIn(t).delay(duration).fadeOut(t, function(){
            $('.popUpDur_'+p1).remove();
        });

        p1++;
    }

    else if (targetLMN && !(duration)){

        $(targetLMN).mouseenter(function(){
            $('body').append('<div id="popUpTar_'+p2+'" class="popUp" style="display:none;"> text </div>');
            $('#popUpTar_'+p2).fadeIn(t);
        });

        $(targetLMN).mouseleave(function(){
            $('#popUpTar_'+p2).fadeOut(t, function(){
                $('#popUpTar_'+p2).remove();
            });
        });

        p2++;
    }
}

我就是想不通！

在此先感谢，所以！

4

1 回答 1

0

与其生成要选择的 id's/classes，不如保留对元素的引用。

// simplified example
var myEl = $("<div></div>").appendTo("body");
myEl.fadeIn(2000).delay(2000).fadeOut(2000,function(){
    myEl.remove();
});
于 2013-10-09T19:42:52.900 回答