Блог

Итак, я создаю базовое приложение для заметок, и у меня есть текстовая область и кнопка отправки, чтобы пользователь мог ввести заметку. У меня возникли проблемы с сбросом текстовой области, чтобы она была пустой, хотя после нажатия кнопки. Я пытался найти решение в Интернете, но все, что я нахожу, — это решения с использованием jquery, когда я использую только ванильный javascript в своем интерфейсе.

Вот html:

 <textarea class="noteInput" rows="10" cols="46" placeholder="Click to start typing your note" maxlength="314"></textarea>
    <button class="submitNoteButton">Add Note</button>
 

И вот javascript до сих пор, единственной проблемной частью является noteInput.value = «» в конце:

 submitNoteButton.addEventListener('click', function submitNote() {
  let noteInput = document.querySelector('.noteInput').value; //Get input from the textArea
  noteList.push(noteInput); //Add the note to the array of notes to be displayed
  console.log(noteList);
  modalbg.style.display = 'none'; //Close the note after the submit button is 
pressed

  //If the user isn't logged in, no need to pull from the database
  if (!loggedIn)
  {
    let notes = document.querySelector('.notes'); //Notes div in the html
    if (notes.length != 0) //If there are already notes, clear them before doing the for loop
    {
      notes.innerHTML = '';
    }
    //For each note in the noteList, display it in the html
    for (let i = 0; i < noteList.length; i  )
    {
      let note = document.createElement('note'); //Create an element for each note
      note.innerHTML = noteList[i]; //Make the text of each note
      note.className = 'note';
      notes.appendChild(note); //Append each note to the notes div
    }
    noteInput.value = "";

  }

})
 

Все работает так, как мне нужно, кроме этой маленькой вещи. Он сообщает мне «Невозможно создать свойство в строке», а затем любую строку, которая была введена последней. Не уверен, почему noteInput.value обрабатывается как строка, а не как текстовая область, как я ее определил. Любая помощь?

Вы определяете noteInput как значение текстовой области, а не самого элемента textarea. Это должно исправить это

 let noteInput = document.querySelector('.noteInput');
noteList.push(noteInput.value);
 

Попробуйте изменить noteInput.value = "" на noteInput = ""