TriggerHandler против триггера в jQuery

Ответ 1

Из Документов в http://api.jquery.com/triggerHandler/

Метод .triggerHandler() ведет себя аналогично .trigger(), с следующие исключения:

• Метод .triggerHandler() не вызывает поведение по умолчанию для событие (например, форма представление).

Не предотвращать действия браузера по умолчанию, позволяющие указать действие, которое происходит в фокусе или выбрать, и т.д. и т.д. и т.д., который применяет стиль. Возможно, у вас есть динамическое меню, основанное на Javascript, поэтому вы не хотите применять стиль только с CSS, иначе те, у кого отключен Javascript, не поймут, почему макет выглядит странно. Вы можете использовать что-то вроде $('menu1select').triggerHandler('click');

• Пока .trigger() будет работать на всех элементах, соответствующих jQuery объект,.triggerHandler() влияет только на первый согласованный элемент.

Если у вас есть событие, которое скрывает элемент onclick, например, и вы хотите вызвать эту функцию вообще, вместо того, чтобы указывать каждый элемент, вы можете использовать $('.menu').triggerHandler('click');

• События, созданные с помощью .triggerHandler(), не создают пузырьки Иерархия DOM; если они не обрабатываются непосредственно целевым элементом, они ничего не делайте.

Предотвращает распространение, надеюсь, не нужно объяснять это...

• Вместо того, чтобы возвращать объект jQuery (чтобы обеспечить цепочку).triggerHandler() возвращает все значение было возвращено последним обработчиком это должно было быть выполнено. Если нет обработчики запускаются, они возвращаются undefined

Этот тоже должен быть самоочевидным...

Ответ 2

В чем преимущество обеспечения собственного события не срабатывает?

• У вас есть действия, связанные с событием "focus", но вы не хотите, чтобы браузер фокусировал его на самом деле (может показаться глупым, но это может произойти, не так ли?) как код, который вам нужен для выполнения один раз без потери текущего фокуса).

• Компонент, который вы хотите запускать "load" (просто пример общей вещи) другого компонента, который находится внутри него.

  В этом случае, если вы вызываете "загрузку" детей, когда приходит "загрузка" родителя, вы не хотите этого делать, потому что это вызовет бесконечный вызов, если event.stopPropagation не вызывается слушатели события "load" (вызванные bubling):

$container.on('load', function () {
    $somethingInsideContainer.trigger('load'); 
    // Would cause a loop if no event.stopPropagation() is called
});

В этом случае вам нужно вызвать triggerHandler().

Ответ 3

Разница 1: вы можете вызвать все элементы, соответствующие объекту JQuery, с помощью триггера.

//Пример1 для триггера. Все три события нажатия кнопки запускаются при использовании триггера. // Попробуйте заменить триггерный метод на triggerHandler(). Вы увидите только первый обработчик события элемента кнопки.

<button id = "button1">button1</button>
<button id = "button2">button2</button>
<button id = "button3">button3</button>

$("#button1").on("click", function(){
alert("button1 clicked");
});
$("#button2").on("click", function(){
alert("button2 clicked");
});
$("#button3").on("click", function(){
alert("button3 clicked");
});

//замените триггер с помощью triggerHandler, чтобы увидеть разницу

$("#button1, #button2, #button3").trigger("click");

Разница 2: при использовании triggerHandler() для события элемента, собственное событие не будет вызываться для этого элемента. trigger() будет работать нормально.

//Пример:

//замените триггер с помощью triggerHandler, чтобы увидеть разницу

 <button id = "button1">button1</button>
  <button id = "button2">button2</button>

$("#button1").on("click", function(){
 $("#button2").trigger('click');

});

$("#button3").on("click", function(){
var value = $("#button2").triggerHandler('click');
    alert('my value:'+ value)
});

$("#button2").on('click', function(){
alert("button2 clicked");

});

Разница 3: trigger() возвращает объект JQuery, тогда как triggerHandler() возвращает последнее значение дескриптора, или если никаких обработчиков не запускается, он возвращает undefined

//Пример3

<button id="button1">Button1</button>
<button id="button2">Button2</button>
<button id="button3">Button3</button>


$("#button1").on("click", function(){
var myValue = $("#button2").trigger('click');
    alert(myValue);
});

$("#button3").on("click", function(){
var value = $("#button2").triggerHandler('click');
    alert('my value:'+ value)
});

$("#button2").on('click', function(){
alert("button2 clicked");
    return true;
});

Другое отличие

События, инициированные с помощью triggerHandler(), не создают пузырьки иерархии DOM; если они не обрабатываются целевым элементом напрямую, они ничего не делают.

Ответ 4

Для меня основное отличие заключается в том, что "triggerHandler" возвращает все, что было возвращено последним обработчиком, тогда как "trigger" возвращает объект jQuery.

Итак, для обработчика, такого как:

  $( document ).on( 'testevent', function ()
  {
    return false;
  });

Используя "triggerHandler" , вы можете сделать следующее:

  if( $( document ).triggerHandler( 'testevent' ) === false )
  {
    return;
  }

Итак, вы должны использовать "triggerHandler" , если хотите ответить на результат, возвращенный обработчиком.