Notice: Функция _load_textdomain_just_in_time вызвана неправильно. Загрузка перевода для домена pb-seo-friendly-images была запущена слишком рано. Обычно это индикатор того, что какой-то код в плагине или теме запускается слишком рано. Переводы должны загружаться при выполнении действия init или позже. Дополнительную информацию можно найти на странице «Отладка в WordPress». (Это сообщение было добавлено в версии 6.7.0.) in /home/artem952/domains/devarts.pro/public_html/wp-includes/functions.php on line 6121
jQuery — очищаем поле с результатом после каждого выполненного события
logo

jQuery — очищаем поле с результатом после каждого выполненного события

seasonvar append example 620x660 - jQuery — очищаем поле с результатом после каждого выполненного события

Уже после написаний данной статьи случайно наткнулся на реальный пример описанного здесь простейшего косяка в jQuery коде. Это известный онлайн кинотеатр сериалов. У них есть премиум и если тыкать на любой из трех пакетов выше, будет бесконечно выводиться ошибка (есть имеются проблемы).

Пример попроще описан ниже. Суть та же. Если тыкать на кнопку будут создаваться заготовленные ранее тексты и добавляться друг за другом.

Исправляется такое недоразумение очень легко, главное не забывать о нем.

jquery clear result 620x344 - jQuery — очищаем поле с результатом после каждого выполненного события

jQuery код решения выше

<!-- HTML CODE -->
<div class="container">
   <p class="button">НАЖАТЬ</p>

   <p class="result"></p>
</div>
задаем по умолчанию значение клика равным нулю
var n = 0;

//выводим результат сразу при загрузке странице
$('.result').append('Нажато ' + n + ' раз<br>');

//создаем событие на клик по кнопке
$('.button').click(function(){
   
   //прибавляем к переменной единицу
   n = n+1;
   
   //выводим строку с результатом 
   $('.result').append('Нажато ' + n + ' раз<br>');

});

Как видно на примере выше, при каждом клике будет добавляться новая строка. Это неудобно, например, когда у нас форма обратной связи и идет проверка введенных результатов.

С подобным решением будут выводиться бесконечное количество результатов. Уберем дублирование.

jQuery код удаления дублей

jquery clear result 1 620x286 - jQuery — очищаем поле с результатом после каждого выполненного события
задаем по умолчанию значение клика равным нулю
var n = 0;

//выводим результат сразу при загрузке странице
$('.result').append('Нажато ' + n + ' раз<br>');

//создаем событие на клик по кнопке
$('.button').click(function(){
   
   //прибавляем к переменной единицу
   n = n+1;
   
   //выводим строку с результатом предварительно очистив ее от всего содержимого
   $('.result').empty().append('Нажато ' + n + ' раз<br>');

});

Мы добавили все лишь один метод .empty() и полностью изменили логику работы скрипта

Похожие записи


JavaScript: автоматизируем вставку рекламы в текст статей на WordPress
Точечно вставить рекламу в конкретную статью на CMS WordPress не составит никаких проблем. Но вставить ее сразу во все статьи...
JS — скрыть внешние ссылки на сайте
Очень простой скрипт для скрытия внешних ссылок на любом сайте. Разрабатывался для CMS WordPress, но будет работать абсолютно везде. Полностью...
jQuery — таймер обратного отсчета с изменяемой скоростью
Рассмотрим наглядный пример управления таймером на jQuery. Задача: Таймер запускается при загрузке страницы. При клике на кнопку с числом скорость...
jQuery Cookies — ограничиваем повтор события с помощью куков
Cookies — возможность сохранить в браузере некие данные, которые не удалятся после обновления страницы. Задача: отследить с помощью javaScript фиксированное...
jQuery — простое модальное окно
В данной статье расскажу про очень простое решение с модальным окном на jQuery. Прикручивал его поверх платного конструктора шаблонов сайта...

Комментарии

Добавить комментарий