在jQuery中创建雪花 [英] Create snowflakes in jquery

问题描述

我使用jquery创建雪花.一切似乎都还可以，但是当您单击特定的薄片时，我想做警报选项，然后它应该警报消息.但是我实现了警报选项不断触发的点击功能.我不确定我在哪里弄错了.我尝试了preventDefault仍然没有任何反应. http://jsfiddle.net/vicky081/4cZdu/12/

I create the snowflake using jquery. Everything seems ok but i want to do alert option when you click particular flake then it should alert the message. But i implemented the click function that alert option is continuously triggering. I am not sure where i did mistake. I tried the preventDefault still nothing happens. http://jsfiddle.net/vicky081/4cZdu/12/

 function snowFalling(){

        // move the snow
        $('.snow').each(function(key, value){

            // check if the snow has reached the bottom of the screen
            if( parseInt($(this).css('top')) > windowHeight - 80 ) {

                // remove the snow from the HTML DOM structure
                $(this).remove();
            }       

            // set up a random speed
            var fallingSpeed = Math.floor(Math.random() * 5 + 1);

            // set up a random direction for the snow to move
            var movingDirection = Math.floor(Math.random()*2);

            // get the snow's current top
            var currentTop = parseInt($(this).css('top'));      

            // get the snow's current top
            var currentLeft = parseInt($(this).css('left'));                

            // set the snow's new top
            $(this).css('top', currentTop + fallingSpeed ); 

            // check if the snow should move to left or move to right
            if( movingDirection === 0){

                // set the snow move to right
                $(this).css('left', currentLeft + fallingSpeed );   

            }else {

                // set the snow move to left
                $(this).css('left', currentLeft + -(fallingSpeed) );                

            }                   

        }); 
        jQuery(this).click(function() {
            alert('You Clicked');
        });

        // repeat the rollIt() function for each 200 microseconds
        window.setTimeout(snowFalling, 200);            

    }        

    // call the function when the document is loaded completely
    generateSnow();   
    snowFalling();

});

现在，我想提醒特定的点击.如何防止在单击雪花时出现多重警报. 谢谢.

Now i want to alert particular click. How to prevent multi alert on click the snow flakes. Thanks.

推荐答案

如果您只希望在单击积雪时发出警报，则将处理程序移至创建雪花的位置，而不是在我们更新雪花时将其移至目前拥有它.

If you only want the alert to occur when snow is clicked, move the handler to the point where the snowflake is created, not when it us updated, as you currently have it.

$('<div />')
    .addClass('snow')
    .css('top', snowTop)
    .css('left', snowLeft)
    .css('position','absolute')
    .html('*')
    .click(function() {
        alert('You Clicked');
    })
);

这篇关于在jQuery中创建雪花的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！