Как приостановить и возобновить интервал

Smeyan · 16.05.24

Я делаю браузерную игру, в которой вы плаваете на кораблях. Вы смотрите сверху, как в GTA 1 и 2. Поэтому, когда вы двигаетесь в определенном направлении, появляется анимация, которая перемещает корабль примерно на 50 пикселей в его направлении. Эта анимация длится 5 секунд. Чтобы загрузить данные сетки, у меня есть таймер, который обновляет данные каждую секунду, но именно здесь эти два конфликтуют. Через секунду анимация прерывается таймером, загружающим данные сетки.
Я пробовал это, но это не останавливает таймер:

Код:

<script> function myMoveUp() { var elem = document.getElementById("myAnimationUp"); var pos = 0; var id = setInterval(frame, 50); Clock.pause(); function frame() { if (pos == 105) { clearInterval(id); Clock.resume(); } else { pos++; elem.style.bottom = pos + 'px'; } } MoveShip(); }
</script>
<script> var Clock = { totalSeconds: 0, start: function () { var self = this; this.interval = setInterval(function () { self.totalSeconds += 1; $("#hour").text(Math.floor(self.totalSeconds / 3600)); $("#min").text(Math.floor(self.totalSeconds / 60 % 60)); $("#sec").text(parseInt(self.totalSeconds % 60)); $('#ShowGridData').load('data/griddata.php'); }, 1000); }, pause: function () { clearInterval(this.interval); delete this.interval; }, resume: function () { if (!this.interval) this.start(); } }; Clock.start(); $('#pauseButton').click(function () { Clock.pause(); }); $('#resumeButton').click(function () { Clock.resume(); }); </script>

Код (разметка):

elonleads · 01.06.24

Спасибо за ваш ответ.
Мне нравится идея спрятать кнопку, чтобы ее нельзя было нажать.
Теперь у меня есть этот код, но он не работает?
Он скрывает кнопку всего на долю секунды.

Код:

<script>
pause: function () { clearInterval(this.interval); delete this.interval; $("#sail_btn").click(function(){ $("#sail_button").hide(); }); }, resume: function () { if (!this.interval) this.start(); $("#sail_btn").click(function(){ $("#sail_button").show(); }); }
</script>
<div id="sail_btn"><button type="submit" class="lst" id="sail_button" name="login_user" href="javascript:void(0)" onclick="myMoveUp()">Sail</button></div>

Код (разметка):

fanatos1 · 07.06.24

У меня это работает. Это была грамматическая ошибка. Теперь мне интересно. У меня есть кнопка, которая вызывает myMoveUp(). Как мне сделать так, чтобы после нажатия кнопки я больше не мог нажимать ее, пока анимация не завершится? Если вы спамите, нажмите кнопку, теперь она выглядит глючной. Могу ли я избежать вызова сценария, если он уже был вызван?

Нионова Нионка · 14.06.24

Он должен быть частью if !this.interval, вот так

Код:

resume: function () {
if (!this.interval){ this.start();
$("#sail_button").show();
} $("#sail_btn").click(function(){ $("#sail_button").show();
});
}

Код (разметка):

Как приостановить и возобновить интервал

Smeyan

elonleads

fanatos1

Нионова Нионка