Как изменить значение атрибута при нажатии на элемент списка?

  • 6 августа 2023 г. 7:19
Ответы на вопрос 5
Для этого можно использовать событие «onclick». Например, чтобы изменить значение атрибута «value» элемента списка, можно использовать следующий код:

<ul>
  <li onclick="this.setAttribute('value','new_value')">List Item 1</li>
  <li onclick="this.setAttribute('value','new_value')">List Item 2</li>
  <li onclick="this.setAttribute('value','new_value')">List Item 3</li>
</ul>
optionMenus.forEach(optionMenu => {
    const selectBtn = optionMenu.querySelector('.select__btn');
    const options = optionMenu.querySelectorAll('.select__option');
    const sBtntext = optionMenu.querySelector('.select__input');

    if (optionMenu) {
        selectBtn.addEventListener("click", function(e) {
            let elem_active = optionMenu.classList.contains("_active")
            optionMenus.forEach(opt => {
                opt.classList.remove('_active');
            })
            optionMenu.classList.toggle("_active", !elem_active)
        });

        options.forEach(option => {
            option.addEventListener("click", function(e) {
                if (e.target.classList.contains('.select__option-text') != null) {
                    sBtntext.value = e.target.innerText;
                    // // //
                    document.querySelector('.total').innerHTML = e.target.innerText;
                    // // //
                };
                options.forEach(el => {
                    el.classList.remove('_active');
                });
                option.classList.add("_active");
                optionMenu.classList.remove("_active")
            });
        });
        window.addEventListener('click', e => {
            const target = e.target
            if (!target.closest('.select__options') && !target.closest('.select__menu')) {
                optionMenu.classList.remove("_active")
            }
        })

    }
}) 
  использовать функцию "select" для работы со списком опций меню 
 опцию можно выбрать кликнув на нее и задать выбранное значение в поле ввода 
 также выбранное значение можно отобразить в элементе с классом "total"
Похожие вопросы