@dfymrf3

Текст в инпут не сохраняется?

Не могу понять как при введении нового текста в инпут,что бы он сохранялся при нажатии на save_buttons

<script>
            let edit_buttons = document.querySelectorAll(".edit-btn");
            let save_buttons = document.querySelectorAll(".save-btn");
            let cancel_buttons = document.querySelectorAll(".cancel-btn");

            for (let i = 0; i < edit_buttons.length; i++) {
                let inputValue = edit_buttons[i].previousElementSibling.innerText;
                 

                edit_buttons[i].addEventListener("click", () => {                   
                    edit_buttons[i].previousElementSibling.innerHTML = `<input type="text" value="${inputValue}">`;
                    save_buttons[i].hidden = false;
                    cancel_buttons[i].hidden = false;
                    edit_buttons[i].hidden = true;               
                });
                save_buttons[i].addEventListener("click", () => {                   
                    edit_buttons[i].hidden = true;
                    
                    save_buttons[i].hidden = true;
                    cancel_buttons[i].hidden = false;
            })
            cancel_buttons[i].addEventListener("click", () => {                   
                    edit_buttons[i].hidden = false;
                    edit_buttons[i].previousElementSibling.innerHTML = inputValue;
                    save_buttons[i].hidden = true;
                    cancel_buttons[i].hidden = true;
            })
            };

    </script>
  • Вопрос задан
  • 61 просмотр
Пригласить эксперта
Ответы на вопрос 1
Stalker_RED
@Stalker_RED
Выбрасываем всё, ставим атрибут contenteditable.

Фичи:
Работает во всех браузерах этого тысячелетия (включая ИЕ 5.5, да-да!).
Сохраняет изменеия автоматически.
Кастомизируется стилями!
Поддерживает ctrl+z, ctrl+v и другие фичи привычного текстового редактора!



Можно, конечно, при наведении показать кнопочки типа "редактировать, сохранить" но не очень понятно зачем.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы