Fokus søgbar når søg popup åbnes – Crocoblock

Brug denne kode til at gøre det nemmere for brugeren at bruge et søgefelt i en popup, når en popup åbnes vælges søge input feltet automatisk efter den er åbnes, dette sikre at brugeren kan begynde at skrive med det samme popup åbner – således at de ikke manuelt skal trykke på input feltet.

Koden virker på desktop, tablet og mobil.

Der skal bruges Crocoblock JetSearch

Ikonet/knap der bruges til at åbne popup skal have class: search-btn-popup

Tilføj til Elementor Brugerdefineret kode - - Start:

<script>
jQuery(document).ready(function ($) {

    function auxoGetSearchInputElement() {
        return document.querySelector('.elementor-popup-modal .jet-ajax-search__field');
    }

    function auxoFocusSearchInput() {
        var inputElement = auxoGetSearchInputElement();

        if (!inputElement) {
            return false;
        }

        inputElement.focus({
            preventScroll: true
        });

        if (typeof inputElement.setSelectionRange === 'function') {
            var inputValueLength = inputElement.value.length;
            inputElement.setSelectionRange(inputValueLength, inputValueLength);
        }

        return document.activeElement === inputElement;
    }

    function auxoWatchForSearchInput() {
        var observer = new MutationObserver(function () {
            var inputElement = auxoGetSearchInputElement();

            if (!inputElement) {
                return;
            }

            auxoFocusSearchInput();
            observer.disconnect();
        });

        observer.observe(document.body, {
            childList: true,
            subtree: true
        });

        setTimeout(function () {
            observer.disconnect();
        }, 3000);
    }

    $(document).on('click touchend', '.search-btn-popup', function (event) {
        if (!auxoFocusSearchInput()) {
            auxoWatchForSearchInput();
        }
    });

});
</script>