问在多个页面上处理事件侦听器

EN

// Accordion
const accordions = document.querySelectorAll('.accordion li');

accordions.forEach(accordion =>{
    accordion.addEventListener('click', (e) => {
        e.preventDefault();
        accordion.classList.toggle('open');
    })
});

// Inline toggle
const inlineToggle = document.getElementById('inline-toggle');

inlineToggle.addEventListener('click', () => {
    inlineToggle.nextElementSibling.classList.toggle('active');
});

const inlineToggleOptions = document.querySelectorAll('.inline-toggle-options button');
inlineToggleOptions.forEach(option => {
    option.addEventListener('click', (e) => {
        // Prevent default
        e.preventDefault();
        // Update sentence text
        inlineToggle.innerHTML = option.dataset.payType;
        // Remove selected class from options
        inlineToggleOptions.forEach(option => {
            option.classList.remove('selected');
        });
        // Add selected class to chosen option
        option.classList.add('selected');
        // Close dialog
        inlineToggle.nextElementSibling.classList.remove('active');
    })
});

// Cover bubbles

// Create the slidepanel
const placeholder = document.getElementById('slidepanel');

// Find all buttons
const button = document.querySelectorAll('.trigger-aside');

button.forEach((button => {

    // Listen for clicks on buttons
    button.addEventListener('click',(e) => {

        // Prevent default
        e.preventDefault();

        // Get the target
        const target = button.dataset.target;
        console.log(target);

        // Call the API
        fetch(`http://****.****.uk/****/****/****/${target}`)
            .then((res) => res.json())
            .then(function(res) {

                // Load HTML into slider panel
                placeholder.innerHTML = res.object.content;

                // Stop body overflow
                document.body.classList.add('overflow-hidden');

                // Create overlay and append
                const overlay = document.querySelector('.overlay');
                overlay.classList.add('active');
                document.body.appendChild(overlay);

                // Show the panel
                placeholder.classList.add('active');
                document.body.appendChild(placeholder);

                // Listen for close
                overlay.addEventListener('click', (e) =>{
                    // Close requested
                    document.body.classList.remove('overflow-hidden');
                    placeholder.classList.remove('active');
                    overlay.classList.remove('active');
                });

            })
            .catch(function(err) {
                // Log error
                console.log(err);
            });

    })
}));