Using single click with double click

displays possible use of on single click and double click events when displaying alert messages

by Larry Lane

HTML

<h1>hello </h1>
            <img src="smile.png" class="center-block">

JavaScript

//the class to click on
var selector = ".center-block";

//set the doubleClicked variable to 0 meaning false
//in this example
var doubleClicked = 0;

//on single click function for selector class
$(selector).on("click",function(){//begin function

    
//use time out function to delay execution for specified amount
//of time in this case I used 2 seconds
setTimeout(function () {
    
    //if doubleClicked equals 0
    if (doubleClicked === 0){//begin if then
            
            //display alert
            alert("hello");
        
    }//end if then else
        
    }, 2000);//<--delay set for two seconds
    
});//end function

//on double click function
$(selector).on("dblclick",function(){//begin function
    
    //set doubleClicked to 1 
    doubleClicked = 1;
    
    //remove the img element
    $("img").remove();
    
    
});//end function