Jquery one: .one() | jQuery API Documentation

jQuery.off() | Кевин Чишолм — Блог

С помощью метода jQuery off вы можете отменить привязку обработчиков одного или нескольких событий для каждого совпадающего элемента.

Большую часть времени интерфейсные веб-разработчики озабочены привязкой обработчиков событий, то есть определением функции JavaScript, которая будет выполняться при возникновении события. Событием может быть щелчок мышью, наведение курсора, прокрутка или любое другое действие, которое пользователь выполняет на странице. И само собой разумеется, что jQuery упрощает привязку событий. Но что делать, если вы хотите удалить привязку события? Могут быть случаи, когда по какой-либо причине вы больше не хотите, чтобы ваша функция обработчика событий выполнялась. это происходит .

Типичным может быть сценарий, когда пользователь не аутентифицирован, и в этом случае вы можете запретить пользователю выполнять определенные действия. Или, возможно, у вас есть бизнес-требование, которое включает отображение рекламы после того, как пользователь продвинул слайд-шоу определенное количество раз. Что ж, частью этого требования может быть то, что реклама должна показываться не менее 10 секунд, и в течение этих десяти секунд вы не хотите, чтобы пользователь мог нажимать кнопки «Назад» или «Далее» в слайд-шоу. .

Метод jQuery.off() позволяет удалить обработчик событий, связанный с помощью метода jQuery.on() . Синтаксис требует, чтобы вы передавали строку в качестве первого аргумента, и эта строка, которую вы передаете методу jQuery.off() , указывает событие, которое вы хотите отменить. Например, у вас могут быть привязанные обработчики событий для событий « click » и « dblclick », и вы можете захотеть отвязать только обработчик события « click », но оставить «9011 click ».0011 dblclick «обработчик событий не поврежден. Но просто помните: вы можете отвязать только те обработчики событий, которые управляются с помощью jQuery.

Попробуйте сами!

В приведенном выше примере есть три элемента абзаца. Нажмите каждый. Когда вы это сделаете, вы увидите, что текст изменится на: «Меня нажали» . Далее нажмите кнопку «Обновить» , чтобы страница перезагрузилась. Теперь щелкните любой из абзацев. Вы заметите, что текст больше не меняется, когда вы нажимаете на каждый из них.

Перейдите на вкладку JavaScript . Вы увидите, что для каждого абзаца есть обработчик события клика. Это изменяет текст на «Я был нажат» при нажатии на абзац. Также есть обработчик события click для первой кнопки. При нажатии этой кнопки метод jQuery off вызывается для каждого абзаца на странице. Это отменяет привязку каждого обработчика событий click . Таким образом, при нажатии любого абзаца текст больше не меняется.

Код примера видео

Если вы хотите загрузить пример кода, посетите эту страницу Github и следуйте инструкциям: bit.ly/FEV-jq-off

Сводка

Хотя jQuery упрощает привязку событий, это также тот случай, когда вы нужно отвязать один. Метод jQuery.off() используется для удаления обработчика событий из одного или нескольких элементов HTML. Таким образом, когда вы передаете строку в качестве первого аргумента, вы просто сообщаете jQuery, какое событие вы хотите отменить. Единственное ограничение метода jQuery.off() заключается в том, что его можно использовать только с обработчиками событий, управляемыми с помощью jQuery.

Скидка 10%! — Используйте код KEVIN10

Подпишитесь на этот блог

Получайте уведомления по электронной почте о новых сообщениях.

Оставьте это пустым:Оставьте это поле тоже пустым:Не меняйте это:

Ваш адрес электронной почты:

 

Поиск в этом блоге

Искать:

Категории

АЯКС Веб-сервисы Amazon (AWS) Угловой Угловой 2 Угловые сервисы Массив. прототип Массивы Асинхронный Определение асинхронного модуля Магистраль Комбинаторы CSS CSS3 Экспресс JS Функции Gulp.js HTML5 Интернет Жасмин Джава JavaScript JavaScript-шаблоны Инструменты JavaScript Весенняя загрузка Java jQuery JSON Меньше CSS Мапбокс Мобильный MongoDB Node.js Шаблоны Node.js НПМ Объектно-ориентированный JavaScript Позиция Реагировать Реагировать на родной Строка.прототип Видео Веб-разработка Веб-производительность Веб-скрейпинг

Теги

ajax угловатый угловой.js множество асинхронный хребет backbone.js перезвонить Каскадные таблицы стилей сорт контекст css директива событие выражать функция функции как HTML HTML5 http JavaScript jquery json урок литералы карта модуль узел узел.js нпм объект объектно-ориентированный объекты упс Опытный образец требовать маршрут объем сервер одностраничное приложение спа этот руководство просмотр

Контактное лицо

Электронная почта

: [email protected]

Телефон: : + 1 (212) 465-3196

Последние сообщения

• Scraper API — введение 17 октября 2020 г.
• addEventListener — введение в собственные обработчики событий JavaScript 9 июня 2020 г.
• Angular CLI для начинающих — ваше первое приложение Angular 2 июня 2020 г.
• Основы установки Angular CLI 26 мая 2020 г.
• Проверка номера телефона Javascript E164 19 мая 2020 г.

Селекторы jQuery — javatpoint

следующий → ← предыдущая Селекторы jQuery используются для выбора элементов HTML и управления ими. Они являются очень важной частью библиотеки jQuery. С помощью селекторов jQuery вы можете находить или выбирать элементы HTML на основе их идентификатора, классов, атрибутов, типов и многого другого из DOM. Проще говоря, вы можете сказать, что селекторы используются для выбора одного или нескольких элементов HTML с помощью jQuery, и после выбора элемента вы можете выполнять с ним различные операции. Все селекторы jQuery начинаются со знака доллара и скобки, например. $(). Она известна как фабричная функция. Фабричная функция $() Каждый селектор jQuery начинается с этого знака $(). Этот знак известен как фабричная функция. Он использует три основных строительных блока при выборе элемента в данном документе. Серийный номер Селектор Описание 1) Имя тега: Представляет собой имя тега, доступное в DOM. Например: $(‘p’) выбирает все абзацы ‘p’ в документе. 2) Идентификатор тега: Представляет тег, доступный с определенным идентификатором в DOM. Например: $(‘#real-id’) выбирает определенный элемент в документе с идентификатором real-id. 3) Класс тега: Представляет собой тег, доступный с определенным классом в DOM. Например: $(‘real-class’) выбирает все элементы в документе, имеющие класс real-class. Давайте рассмотрим простой пример использования селектора тегов. Это выберет все элементы с именем тега , а цвет фона будет установлен на «розовый». Файл: firstjquery.html Первый пример jQuery Это первый абзац. Это второй абзац. Это третий абзац. Протестируйте сейчас Выход: Это первый абзац. Это второй абзац. Это третий абзац. Примечание: 1. Все вышеперечисленные селекторы можно использовать отдельно или в сочетании с другими селекторами. Примечание: 2. Если у вас есть конфликт с использованием знака доллара $ в какой-либо библиотеке JavaScript, вы можете использовать функцию jQuery() вместо заводской функции $(). Фабричная функция $() и функция jQuery одинаковы. Как использовать селекторы Селекторы jQuery можно использовать отдельно или в сочетании с другими селекторами. Они требуются на каждом этапе использования jQuery. Они используются для выбора именно того элемента, который вы хотите из вашего HTML-документа. Серийный номер Селектор Описание 1) Имя: Выбирает все элементы, которые соответствуют заданному имени элемента. 2) #ID: Выбирает один элемент, соответствующий заданному идентификатору. 3) .Class: Выбирает все элементы, соответствующие данному классу. 4) Универсальный(*) Выбирает все элементы, доступные в DOM. 5) Несколько элементов A,B,C Выбирает объединенные результаты всех указанных селекторов A,B и C. Различные селекторы jQuery 9010 8 Это выберет последний элемент p 90 108 Это выберет все нечетные элементы tr 9010 8 $( «p:only-of-type») Селектор Пример Описание * $(«*») Используется для выбора всех элементов. #id $(«#firstname») Будет выбран элемент с .class $(«.primary») выберите все элементы с класс,.класс $(«.основной,.вторичный») Будут выбраны все элементы с классом «первичный» или «вторичный» элемент $(«p») Будут выбраны все элементы p. el1,el2,el3 $(«h2,div,p») Будут выбраны все элементы h2, div и p. :first $(«p:first») Будет выбран первый элемент p :last $(«p:last») :even $(«tr:even») Это выберет все четные элементы tr :odd $(«tr:odd») :first-child $(«p:first-child») Будут выбраны все элементы p, которые являются первыми дочерними элементами своего родителя :first-of-type $ ( «p:first-of-type») Будут выбраны все элементы p, которые являются первым элементом p их родителя : Последний ребенок $ («P: Последний ребенок») . Он выберет все элементы P, которые являются последним ребенком их родителей : последнее время $ ($ ( «p:last-of-type») Будут выбраны все элементы p, которые являются последним элементом p своего родителя :nth-child(n) $(«p:nth-child(2 )») Это выберет все элементы p, которые являются вторыми дочерними элементами их родителя :nth-last-child(n) $(«p:nth-last-child(2)») Это выберет все элементы p, которые являются вторыми дочерними элементами своего родителя, считая от последнего дочернего элемента :nth-of-type( n) $(«p:nth-of-type(2)») Будут выбраны все элементы p, которые являются вторым элементом p своего родителя :nth-last-of-type(n ) $(«p:nth-last-of-type(2)») При этом будут выбраны все элементы p, которые являются 2-м элементом p своего родителя, считая от последнего дочернего элемента :only-child $(«p:only-child») Будут выбраны все элементы p, которые являются единственными потомками своего родителя :only-of-type Будут выбраны все элементы p, которые являются единственными дочерними элементами своего типа для своего родителя parent > child $(«div > p») Он выберет все элементы p, которые являются прямыми дочерними элементами элемента div родительский потомок $(«div p») Выбираются все элементы p, являющиеся потомками элемента div элемент + следующий $(«div + p») элемент, который находится рядом с каждым элементом div element ~ siblings $(«div ~ p») Выбирает все элементы p, которые являются братьями и сестрами элемента div :eq(index) 9 0134 $(«ul li:eq(3)») Будет выбран четвертый элемент в списке (индекс начинается с 0) :gt(no) $(«ul li:gt(3)») Выберите элементы списка с индексом больше 3 :lt(no) $( «ул li:lt(3)») Выбрать элементы списка с индексом меньше 3 :not(selector) $(«input:not(:empty)») Выбрать все элементы ввода, которые не пусты :header $(«:header») Выделить все элементы заголовка h2, h3 . .. :animated $(«:animated») Выбрать все анимированные элементы :focus $(«:focus») имеет фокус : contains(text) $(«:contains(‘Hello’)») Выбрать все элементы, содержащие текст «Hello» :has(selector) $(«div:has(p) «) Выбрать все элементы div, содержащие элемент p :empty $(«:empty») Выбрать все пустые элементы :parent $(«:parent») Выбрать все элементы, которые являются родительскими другого элемента :скрытый $(«p:скрытый») Выбрать все скрытые элементы p все видимые таблицы :root $(«:корень») Будет выбран корневой элемент документа :lang(language) $(«p:lang(de)») Выбрать все элементы p со значением атрибута lang, начинающимся с «de» [атрибут] $(«[href]») Выбрать все элементы с атрибутом href [атрибут=значение] $(«[href=’default. Добавить комментарий Отменить ответ Ваш адрес email не будет опубликован. Обязательные поля помечены * Комментарий * Имя * Email * Сайт Поиск: Рубрики Seo Wordpress Дизайн Заработок Плагин Разное Рекомендац Сайт Совет Советы Тем Темы Урок Уроки