2014-02-16 34 views
0

的多个元素相同的功能我有一个JavaScript函数,看起来像这样:的JavaScript运行在同一时间

function buttonClick() 
{ 
    var numberPop = Math.floor((Math.random()*1000)+1); 
    $("#number-add-" + numberPop).fadeOut(2000); 
} 

我必须点击多次运行此功能的按钮的能力。但是,有时候,我会在它影响的前一个元素淡出之前单击它。因此,前一个元素的淡入在中间停止。

我该怎么做才能让这个函数继续淡化先前受影响的元素同时淡化当前元素?这样,多个元素可以同时消失。

编辑:

这是整个代码:

function buttonClick(subEvent) 
{ 
    var numberPop = Math.floor((Math.random()*1000)+1); 
    var mainEvent = subEvent ? subEvent : window.event; 
    var div = document.getElementById('number'); 
    div.innerHTML = div.innerHTML + '<div class="number-pop" id="number-add-'+ numberPop +'" style="z-index:99; position:absolute;margin-top:'+ (mainEvent.screenY - 98) +'px;margin-left:'+ (mainEvent.screenX - 12) +'px;">'+ '+1' +'</div>'; 
    $("#number-add-" + numberPop).stop(true, false).animate({top: "+=-200", opacity:'0'}, 3000, 'linear'); 
} 
+1

这应该工作;它不应该因为你在另一个元素上调用'fadeOut'而停止淡化其他元素。其他事情正在发生。你能提供更多的代码吗,最好是一个小提琴或演示吗? –

+0

@EdCottrell我已经为我的整个功能添加了代码。 – user2898075

+0

@ user2898075看起来可能是使用'innerHTML'的一个副作用。此外,还有一个“1/1000”的机会,这将创建多个具有相同值的_ids_ –

回答

0

这很难说,如何解决它没有所有代码(HTML + JS)的 - 我们可以” t看看id为“number”的元素是什么。这就是说,它看起来像你只是试图追加新的HTML。因此,更换此:

var div = document.getElementById('number'); 
div.innerHTML = div.innerHTML + '<div class="number-pop" id="number-add-'+ numberPop +'" style="z-index:99; position:absolute;margin-top:'+ (mainEvent.screenY - 98) +'px;margin-left:'+ (mainEvent.screenX - 12) +'px;">'+ '+1' +'</div>'; 

与此:

$('#number').append('<div class="number-pop" id="number-add-'+ numberPop +'" style="z-index:99; position:absolute;margin-top:'+ (mainEvent.screenY - 98) +'px;margin-left:'+ (mainEvent.screenX - 12) +'px;">'+ '+1' +'</div>'); 

这将增加新的HTML而不重置现有元素。

+0

工程就像一个魅力!谢谢! – user2898075

相关问题