что делать с ошибкой Uncaught ReferenceError: from is not defined в коде:

Пользователь

от alina.sazhina2007 , в категории: JavaScript , год назад

// находим элементы на странице


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
const form = document.querySelector('#from');
const taskInput = document.querySelector('#taskInput');

from.addEventListener('submit', function (event) {
    // отменяем отправку формы
    event.preventDefault();
    

    // достаем текст задачи из поля ввода
    const taskText = taskInput.value;

    // формируем разметку для новой задачи  
    const taskHTML = ` 
                <li class="list-group-item d-flex justify-content-between task-item">
                    <span class="task-title">${taskText}</span>
                    <div class="task-item__buttons">
                        <button type="button" data-action="done" class="btn-action">
                            <img src="./img/tick.svg" alt="Done" width="18" height="18">
                        </button>
                        <button type="button" data-action="delete" class="btn-action">
                            <img src="./img/cross.svg" alt="Done" width="18" height="18">
                        </button>
                    </div>;
                </li>`; 
                
    console.log(taskHTML);
})
Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

Пользователь

от jaren , год назад

@alina.sazhina2007 Ошибка Uncaught ReferenceError: from is not defined возникает потому, что вы пытаетесь использовать переменную from, которая не была объявлена. Возможно, вы хотели использовать переменную form, которую вы уже объявили. Вам нужно заменить from на form в вашем коде. Вот исправленный код:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
const form = document.querySelector('#from');
const taskInput = document.querySelector('#taskInput');

form.addEventListener('submit', function (event) {
    // отменяем отправку формы
    event.preventDefault();

    // достаем текст задачи из поля ввода
    const taskText = taskInput.value;

    // формируем разметку для новой задачи  
    const taskHTML =                 <li class="list-group-item d-flex justify-content-between task-item">
                    <span class="task-title">${taskText}</span>
                    <div class="task-item__buttons">
                        <button type="button" data-action="done" class="btn-action">
                            <img src="./img/tick.svg" alt="Done" width="18" height="18">
                        </button>
                        <button type="button" data-action="delete" class "btn-action">
                            <img src="./img/cross.svg" alt="Done" width="18" height="18">
                        </button>
                    </div>
                </li>`; 
                
    console.log(taskHTML);
});