Событие щелчка по кнопке с JavaScript не работает в Django

это код для (cart.js) в папке static/js

var updateBtns = document.getElementsByClassName('update-cart')

for (i = 0; i < updateBtns.length; i++) {
    updateBtns[i].addEventListener('click', function(){
        var productId = this.dataset.product
        var action = this.dataset.action
        console.log('productId:', productId, 'Action:', action)
        
    })
}

и в HTML файле в нижней части:

<button data-product="{{ product.id }}" data-action="add"
                class="update-cart btn btn-outline-secondary add-btn ">Add to Cart</button>

и вызовите js в файле main.html

<script type="text/javascript" src="{% static 'js/cart.js' %}"> </script>

и я добавляю static в setting.py, и все правильно.

и все работает хорошо, когда я пытаюсь (console.log) без события нажатия кнопки... проблема только с событием нажатия кнопки, потому что оно не работает

Ваш вопрос не имеет отношения к Django. Похоже, что вы неправильно используете JavaScript. Когда браузер выполняет код из card.js, дерево HTML DOM еще не построено. Чтобы подключить события JS, вам нужно изменить код cart.js следующим образом:

function initUpdateBtns() {
    var updateBtns = document.getElementsByClassName('update-cart')

    for (i = 0; i < updateBtns.length; i++) {
        updateBtns[i].addEventListener('click', function(){
            var productId = this.dataset.product
            var action = this.dataset.action
            console.log('productId:', productId, 'Action:', action)
        })
    }
}

document.addEventListener('DOMContentLoaded', initUpdateBtns)

Возможно, я опоздал с ответом на этот вопрос, но это может помочь кому-то в будущем.

Решение: Убедитесь, что ваши теги сценария:

<script type="text/javascript" src="{% static 'js/cart.js' %}"> </script>

находится между тегами body

Вернуться на верх