У меня на сайте пошаговая система, все работает хорошо. Однако при нажатии backhome я хочу go вернуться к первому шагу. Это работает, однако предыдущая функция все еще срабатывает. Таким образом, это означает, что он остается дома несколько секунд, а затем переходит к следующему слайду.
Codepen: - https://codepen.io/scottYg55/pen/JjdPQrg
Есть ли способ остановить функционировать полностью, если нажать кнопку «backhome»?
HTML
<script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
<div class="main-container">
<div class="all-steps">
<div class="step homestep">
INFO
<ul>
<li class="backhome">HOME CLICK HERE</li>
</ul>
</div>
<div class="step character">
INFO2
<ul>
<li class="backhome">HOME CLICK HERE</li>
</ul>
</div>
<div class="step">
INFO3
<ul>
<li class="backhome">HOME CLICK HERE</li>
</ul>
</div>
</div>
CSS
.step {
display: none;background:red;
}
.step.current {
display: inherit;
}
jQuery
$(function () {
/* STEPS START */
var $sections = $('.step');
function navigateTo(index) {
// Mark the current section with the class 'current'
$sections
.removeClass('current')
.eq(index)
.addClass('current');
// Show only the navigation buttons that make sense for the current section:
if ($(".homestep").hasClass("current")) {$(".home-top, .home-bottom").show();}else($(".home-top, .home-bottom").hide())
if ($(".current").hasClass("homestep")) {
setTimeout(function() {
navigateTo(curIndex() + 1);
// }, 6000);
}, 2000);
}
if ($(".current").hasClass("character")) {
setTimeout(function() {
navigateTo(curIndex() + 1);
}, 2000);
}
$(".backhome").on('click',function(){
event.preventDefault();
navigateTo(0);
});
$(".backstudent").on('click',function(){
navigateTo(1);
});
}
function curIndex() {
// Return the current index by looking at which section has the class 'current'
return $sections.index($sections.filter('.current'));
}
// Previous button is easy, just go back
$('.previous').click(function() {
navigateTo(curIndex() - 1)
});
$('.next').click(function() {
navigateTo(curIndex() + 1);
if ($(this).hasClass("lecturer-button")) {
$('.student-temp').hide();
}
});
navigateTo(0); // Start at the beginning
/* STEPS END */
});