jQuery: $ (). click (fn) vs. $ (). bind ('click', fn);

115

При использовании jQuery для подключения обработчика событий есть ли разница между использованием метода click

$().click(fn)

по сравнению с использованием метода привязки

$().bind('click',fn);

Кроме необязательного параметра данных привязки.

javascript jquery event-handling

— Алан Сторм
источник

Похоже, что у click также есть необязательный параметр данных. Кто-нибудь знает, есть ли различия в том, как это работает? Источник: api.jquery.com/click

— Ник Уделл,

137

Для чего это стоит, из источника jQuery :

jQuery.each( ("blur,focus,load,resize,scroll,unload,click,dblclick," +
    "mousedown,mouseup,mousemove,mouseover,mouseout,mouseenter,mouseleave," +
    "change,select,submit,keydown,keypress,keyup,error").split(","), function(i, name){

    // Handle event binding
    jQuery.fn[name] = function(fn){
        return fn ? this.bind(name, fn) : this.trigger(name);
    };
});

Так что нет никакой разницы -

$().click(fn)

звонки

$().bind('click',fn)

— Мэтью Маравильяс
источник

6

Верно - click()это в основном сокращение для bind('click')(или, в наши дни, оно действительно вызывает on('click'). Насколько я понимаю, вы могли бы также избавить себя от этого дополнительного вызова функции, используя on('click')напрямую.

— Nix

Они делают то же самое, но bind (), скажем так, я хочу, чтобы что-то происходило при наведении курсора и щелчках мыши и т. Д. См. Пример на stackoverflow.com/a/519455/292408 ниже. Конечно, вы можете привязаться только к одному событию, например, к щелчку.

— Элайджа Линн

98

+1 за ответ Мэтью, но я подумал, что должен упомянуть, что вы также можете связать более одного обработчика событий за один раз, используя bind

$('#myDiv').bind('mouseover focus', function() {
    $(this).addClass('focus')
});

что намного чище эквивалент:

var myFunc = function() {
    $(this).addClass('focus');
};
$('#myDiv')
    .mouseover(myFunc)
    .focus(myFunc)
;

— nickf
источник

20

+1 Эта привязка нескольких событий для меня новость и, возможно, весьма полезна.

— cletus

7

Есть одно отличие в том, что вы можете привязать пользовательские события, используя вторую форму, которая у вас есть. В остальном они кажутся синонимами. См .: Документы событий jQuery.

— nickohrn
источник

1

Есть параметр [data] привязки, который будет выполняться только во время привязки, один раз.

Вы также можете указать настраиваемые события в качестве первого параметра привязки.

— Аарон
источник

1

Я считаю, что .click () более логичен, но я думаю, это то, как вы думаете о вещах.

$('#my_button').click(function() { alert('BOOM!'); });

Кажется, это настолько просто, насколько это возможно.

— СЦВЗ
источник

0

Если у вас есть Google Chrome, их инструменты разработчика имеют инструмент прослушивания событий, выберите элемент, который вы хотите отслеживать его событие.

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

— Омар Абид
источник

0

Я предпочитаю .bind () из-за согласованности интерфейса с .live () . Это не только делает код более читабельным, но и упрощает изменение строки кода для использования одного метода вместо другого.

— danorton
источник