Привет, ребята, у меня есть код, который переключается из одного состояния в другое, когда вы нажимаете кнопку (он запускает видео и смешивается). Теперь я пытаюсь сказать свой обработчик событий, если кто-то нажимает очень быстро, он не должен использовать его в качестве ввода. Что-то вроде = Обработчик событий, пожалуйста, обратите внимание всего на один щелчок за одну секунду. Надеюсь, здесь мой код понятен:
<script>
var clickState = 0;
var btn = document.querySelector('#playbutton');
btn.addEventListener('click', function(){
if (clickState == 0) {
document.querySelector('#toggler').emit('fade_1');
var videoEl_1 = document.querySelector('#video');
videoEl_1.play();
document.querySelector( "#skyid" ).emit('fade_1');
clickState = 1;
} else {
document.querySelector('#toggler').emit('fade_2');
var videoEl_1 = document.querySelector('#video');
videoEl_1.pause();
document.querySelector( "#skyid" ).emit('fade_2');
clickState = 0;
}
});
</script>



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Вы можете отключить кнопку при ее нажатии, а затем установить тайм-аут, чтобы снова включить ее через секунду.
Как это
$( document ).ready(function() {
$("#myButton").click(function(){
// disable the button
$("#myButton").prop("disabled", true);
//do the things you want the button to do:
console.info("doing stuff");
// reenable the button after 1 second
setTimeout(function(){
$("#myButton").prop("disabled", false);
}, 1000);
});
});
Пример здесь:
https://jsfiddle.net/20n1gb89/8/
Я использовал здесь jQuery, но setTimeout - это собственный JavaScript
редактировать:
Кажется, вы определяете обработчик щелчка внутри обработчика щелчка для той же кнопки. Смотрите мои комментарии. Удалите btn.addEventListener и просто сохраните оператор if else. Посмотрим, работает ли это.
$(document).ready(function () {
// here you define a click handler for playbutton
$("#playbutton").click(function () {
// disable the button
$("#playbutton").prop("disabled", true);
//do the things you want the button to do:
var clickState = 0;
var btn = document.querySelector('#playbutton');
// here you define a click handler for the same button
// inside the first click handler. You shouldn't do that.
btn.addEventListener('click', function () {
if (clickState == 0) {
document.querySelector('#toggler').emit('fade_1');
var videoEl_1 = document.querySelector('#video');
videoEl_1.play();
document.querySelector("#skyid").emit('fade_1');
clickState = 1;
} else {
document.querySelector('#toggler').emit('fade_2');
var videoEl_1 = document.querySelector('#video');
videoEl_1.pause();
document.querySelector("#skyid").emit('fade_2');
clickState = 0;
}
console.info("doing stuff");
// reenable the button after 1 second
setTimeout(function () {
$("#playbutton").prop("disabled", false);
}, 2000);
});
});
});
редактировать 2:
Это. Попробуй это:
$(document).ready(function () {
$("#playbutton").click(function () {
// disable the button
$("#playbutton").prop("disabled", true);
//do the things you want the button to do:
var clickState = 0;
// this doesn't really make sense. clickState will always be 0
// as it is defined as 0 each time you click the button. You
// will need to define clickState outside the click handler
// for this to work.
if (clickState == 0) {
document.querySelector('#toggler').emit('fade_1');
var videoEl_1 = document.querySelector('#video');
videoEl_1.play();
document.querySelector("#skyid").emit('fade_1');
clickState = 1;
} else {
document.querySelector('#toggler').emit('fade_2');
var videoEl_1 = document.querySelector('#video');
videoEl_1.pause();
document.querySelector("#skyid").emit('fade_2');
clickState = 0;
}
console.info("doing stuff");
// reenable the button after 1 second
setTimeout(function () {
$("#playbutton").prop("disabled", false);
}, 2000);
});
});
});
ошибок нет вроде работает немного. вы не можете нажимать быстро, но и первый щелчок не будет замечен, и иногда его все еще можно щелкнуть до истечения тайм-аута
он работает, но не постоянно, это немного сбивает с толку, как когда вы нажимаете 5 раз или что-то, что он прыгает thx fpr, помощь мне в порядке с этим результатом, я не думаю, что кто-то нажимает это 5 раз очень быстро подряд
теперь все в порядке :) может мне просто нужно было удалить кеш или что-то большое спасибо
Вы можете добавить прослушиватель событий по щелчку и создать с его помощью таймер
например, здесь после того, как пользователь нажимает кнопку, мы запускаем таймер на 1000 мс, если кнопка нажата в течение этого временного интервала, мы отобразим предупреждение.
var btn = document.querySelector('#playbutton');
btn.addEventListener('click', function(){
setTimeout(function(){
if (btn.clicked == true){
alert("Cmon dude, chill a little");
}
}, 1000);
});
хм, я попытался вставить свой код в `делаю вещи *, но он хочет, чтобы он работал правильно, какая-то идея?