Метод trigger

Метод trigger позволяет запустить все обработчики событий, привязанные к элементу для событий заданного типа. Он вызывает функции-обработчики в том порядке, в котором они бы вызывались пользователем. Если вы хотите вызвать обработчик событий, но не выполнять стандартное событие, то воспользуйтесь методом triggerHandler.

Синтаксис

В качестве первого параметра мы можем передать тип события в виде строки, вторым (необязательным) массив или объект, содержащим дополнительные параметры для передачи обработчику:

javascript$(селектор).trigger(тип события, [дополнительные параметры]);

Можно первым параметром передать событие в виде объекта jQuery.Event:

javascript$(селектор).trigger(событие, [дополнительные параметры]);

Есть разница между передачей дополнительных параметров методу trigger и данных в метод on. В в первом случае данные должны быть определены во время выполнения события, а во втором уже на момент превязки функции-обработчика.

Пример

При нажатии на кнопку #first значение будет увеличиваться только в первом спане, при нажатии на кнопку #second - в обоих, при этом имитируя на первой клик пользователя. Функция increase будет увеличивать на 1 число, передаваемое ей в качестве параметра. При помощи метода trigger мы заставляем срабатывать также событие по клику и в первом спане, хотя нажимаем на кнопку #second:

html<button id="first">button1</button>
<button id="second">button2</button>
<div><span>0</span></div>
<div><span>0</span></div>

cssbutton {
  margin: 10px;
}

div {
  margin-left: 10px;
  font-weight: bold;
}

span {
  color: green;
}

javascript$('#first').click(function() {
  increase($('span').first());
});

$('#second').click(function() {
  $('#first').trigger('click');
  increase($('span').last());
});

function increase(str) {
  let num = parseInt(str.text(), 10);
  num.text(num + 1);
}

Смотрите также