javascript - 在移动版网站上使用 javascript 未添加 CSS 类

Question

我使用以下代码将类添加到 Wordpress 网站上的 svg 图像。

window.addEventListener('load', function () {
    const svg = document.querySelector('svg')

    if (svg) {
        const items = document.querySelectorAll(
            '.woocommerce-grouped-product-list-item'
        )

        if (items) {
            items.forEach((item) => {
                item.addEventListener('mouseenter', (e) => {
                    item.classList.add('tab-brackground--active')
                    const text = e.target.children[0].innerText
                    jQuery(`[data-section="${text.toLowerCase()}"]`).addClass(
                        'svg--active'
                    )
                })
            })
        }
    }
}) 



item.classList.add('tab-brackground--active')

适用于我的移动和桌面版本，而

jQuery(`[data-section="${text.toLowerCase()}"]`).addClass('svg--active')

仅适用于我的桌面版本。

您可以在此链接上自行查看 - https://ticketblaster.com.au/product/keith-urban-melbourne-friday-10th-december-2021/

我该怎么做才能解决这个问题？

Answer 1

@Ziyak，您已经将 mouseenter 用作 eventListener，它仅适用于桌面，不适用于移动设备。尝试为移动设备使用 touchmove、touchstart 和 touchend 等事件。