Сделайте так, чтобы ввод исчез, когда я снова нажму на него

#javascript #html

Вопрос:

Как мне сделать так, чтобы, когда я ввожу что-то в поле ввода, и я отменяю выбор/щелчок из поля, а затем снова нажимаю на поле ввода, текст/ввод, который я написал, исчезает?

Ответ №1:

Вы можете добавить focus прослушиватель во входные данные и очищать значение при каждом запуске этого события.

Ссылка на скрипку: https://jsfiddle.net/dfa6m42e/1/

 let inp = document.querySelector('#myInput')

inp.addEventListener('focus', () => {
  inp.value = '';
}) 
 <input type="text" id='myInput'> 

Комментарии:

1. Хотя это работает, это отрицательное значение для использования jQuery, когда это простой вопрос.

2. @KentondeJong Спасибо за отзыв, я отредактировал ответ, чтобы использовать vanilla JS

3. Я перешел на повышающий голос. Я использую jQuery с 2011 года. Это жесткая привычка-перестать употреблять.

Ответ №2:

Я не уверен, что вам нужно событие размытия. Вы можете добавить что-то подобное везде, где вы инициируете прослушивание событий.

 var inputElement = document.getElementById("myinputelement");
inputElement.addEventListener("focus", function(e) {
  this.value="";
})
 

Ответ №3:

Как насчет этого?

 let input = document.querySelector('input');
input.onclick = function(){ input.value = ''; };
 

Комментарии:

1. @Spectric Может быть, человеку не понравился «старый» синтаксис. Кто знает!

Ответ №4:

Вы можете использовать событие размытия для добавления события фокусировки

 var myInput = ...;
myInput.addEventListener("blur", function(e) {
  myInput.removeEventListener("blur", this);
  myInput.addEventListener("focus", function(e) {
    myInput.value = "";
  }
}