Могу ли я запретить $ .scrollify.next () до тех пор, пока не будет нажат элемент? - PullRequest
Новая
       24

Могу ли я запретить $ .scrollify.next () до тех пор, пока не будет нажат элемент?

0 голосов
/ 26 октября 2019

Я использую jquery-scrollify, чтобы помочь пользователям пройти через форму. Они должны ответить на один вопрос, прежде чем ответить на следующий.

Проблема с отключением прокрутки все вместе заключается в том, что пользователь должен иметь возможность прокрутки назад вверх, чтобы изменить / просмотреть предыдущий ответ, но не должен иметь возможность прокручивать следующий элемент, пока не будет дан ответ на предыдущий.

Я пытался скрыть все будущие разделы до тех пор, пока не будет нажат элемент элемента, но тогда $ .scrollify.next () не работает. Также я не могу перейти к следующему разделу, даже если он больше не скрыт. 

<div class="scroller">
    <section class="scroll-section green">
        <h1>This is section one</h1>
        <a href="" class="btn btn-white">One</a>
        <a href="" class="btn btn-white">Two</a>
        <a href="" class="btn btn-white">Three</a>
    </section>
    <section class="scroll-section orange hide-section">
        <h1>This is section two</h1>
        <a href="" class="btn btn-primary">One</a>
        <a href="" class="btn btn-primary">Two</a>
        <a href="" class="btn btn-primary">Three</a>
    </section>
    <section class="scroll-section blue hide-section">
        <h1>This is section three</h1>
        <a href="" class="btn btn-pink">One</a>
        <a href="" class="btn btn-pink">Two</a>
        <a href="" class="btn btn-pink">Three</a>
    </section>
    <section class="scroll-section red hide-section">
        <h1>This is section four</h1>
        <a href="" class="btn btn-white">One</a>
        <a href="" class="btn btn-white">Two</a>
        <a href="" class="btn btn-white">Three</a>
    </section>
</div>

$('.btn').click(function(e) {
    e.preventDefault();
    $thisSection = $(this).closest('.scroll-section');
    $nextSection = $thisSection.next();
    $nextSection.removeClass('hide-section');
    setTimeout(function() {
        $.scrollify.next();
    }, 300);
});

.hide-section {
    display: none;
}

Я ожидаю, что после нажатия .btn в разделе .green страница будетвыделите раздел .orange. Вместо этого .hide-section удаляется, но не будет прокручиваться.

...