How to add class to jquery for a few seconds to remove and then remove the class?

the problem of a rookie

I want to set the phone to click the wake-up menu button on the screen. After a few seconds, the menu is automatically hidden. What I think of now is to use setTimeout (),
to bind the click click event in body, and then use .addClass () to specify class, for the element machine in this click function. Then add setTimeout () to remove it after a few seconds. So there will be a problem, that is, the setTimeout () execution will accumulate, that is, click trigger. The, setTimeout () will be executed several times, that is, removing the class multiple times.

how can click be executed only once multiple times in the time set by setTimeout ()?

 $("body").on("click",function(){
    $("body").addClass("touchmove");
    setTimeout(function(){
          $("body").removeClass("touchmove");
     },5000);
      

});
Mar.29,2021

var timer;
$('body'). On (' click',function () {

)
clearTimeout(timer);
timer = setTimeout( function(){
    $('body').addClass('touchmove');
    setTimeout(function(){
          $('body').removeClass('touchmove');
     },5000);
} , 200 );

});


in order to invalidate the trigger of the click handler again before it ends, you can use the one method of jQuery, that is, to make click valid only once. At the end of the handler, bind a valid handler to body again.

function clickHandler(){
    $('body').addClass('touchmove');
    setTimeout(function(){
          $('body').removeClass('touchmove');
          $('body').one('click', clickHandler);
     }, 5000);
}

$('body').one('click', clickHandler);
Menu