Переменная SetTimeout Jquery

131

10 января 2021, 09:40

Каким образом можно задать переменную в 1400 миллисекунд для setTimeout и вызвать ее а не прописывать каждый раз для разных функций setTimeout = 1400.

Пример:

$('.modal-icon').click(function(){ 
$('#block').addClass('out'); 
setTimeout(function() { 
$('body').css("overflow", "visible"); 
}, 1400); 
}); 
 
 
$('.modal-icon').click(function(){ 
$('#block-2').addClass('clock'); 
setTimeout(function(){ 
$('body').css("overflow", "auto"); 
},1400); 
}); 
 
 
$('.modal-icon').click(function(){ 
$('#block-3').addClass('fire'); 
setTimeout(function(){ 
$('body').css("display", "none"); 
},1400); 
});

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Answer 1

что касается вопроса

let to1400 = f => setTimeout(f, 1400); 
 
$('.modal-icon').click(function(){ 
  $('#block').addClass('out'); 
  to1400( () => $('body').css("overflow", "visible") ) 
}); 
 
 
$('.modal-icon').click(function(){ 
  $('#block-2').addClass('clock'); 
  to1400( () => $('body').css("overflow", "auto") ) 
}); 
 
 
$('.modal-icon').click(function(){ 
  $('#block-3').addClass('fire'); 
  to1400( () => $('body').css("display", "none") ) 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

что касается подсократить приведенный участок кода:

let action = (b, c, p, v) => $(b).addClass(c) && setTimeout(() => $('body').css(p, v), 1400) 
let iconClick = f => $('.modal-icon').click(f); 
iconClick(() => action('#block', 'out', "overflow", "visible")) 
iconClick(() => action('#block-2', 'clock', "overflow", "auto")) 
iconClick(() => action('#block-3', 'fire', "display", "none"))

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Answer 2

$('.image3D-1').click(function(){ 
var buttonId = $(this).attr('id'); 
$('#block-modal').removeAttr('class').addClass(buttonId); 
$('body').css("overflow", "hidden"); 
}) 
 
$('.image3D-2').click(function(){ 
var buttonId = $(this).attr('id'); 
$('#block-modal-2').removeAttr('class').addClass(buttonId); 
$('body').css("overflow", "hidden"); 
})