.bind () vs. .on () jQuery's

Znalazłem dwa świetne artykuły mówiące o nowej funkcji .on(): jquery4u.com , elijahmanor.com .

Czy jest jakiś sposób, w którym .bind()nadal lepiej jest używać destylatora .on()?

Na przykład mam przykładowy kod, który wygląda następująco:

$("#container").click( function( e ) {} )

Możesz zauważyć, że wybrałem tylko jeden element przez selektor, aw moim przypadku <div>nazwa ta #containerjuż istnieje, gdy moja strona została załadowana; nie dodawane dynamicznie. Ważne jest, aby wspomnieć, że korzystam z najnowszej wersji jQuery: 1.7.2.

W przypadku tej próbki należy .on()użyć zamiast, .bind()nawet jeśli nie korzystam z innych funkcji udostępnianych przez .on()funkcję?

Wewnętrznie .bindodwzorowuje bezpośrednio .onw bieżącej wersji jQuery. (To samo tyczy się .live.) Tak więc, jeśli użyjesz .bindzamiast tego, istnieje niewielki, ale praktycznie nieistotny spadek wydajności .

Mogą jednak .bindzostać usunięte z przyszłych wersji w dowolnym momencie. Nie ma powodu, aby nadal używać .bindi każdy powód, aby preferować .on.

Wszystkie te fragmenty działają dokładnie tak samo:

element.on('click', function () { ... });
element.bind('click', function () { ... });
element.click(function () { ... });

Jednak różnią się one bardzo od tych, które wszystkie wykonują to samo:

element.on('click', 'selector', function () { ... });
element.delegate('click', 'selector', function () { ... });
$('selector').live('click', function () { ... });

Drugi zestaw procedur obsługi zdarzeń korzysta z delegowania zdarzeń i będzie działał dla dynamicznie dodawanych elementów. Procedury obsługi zdarzeń korzystające z delegowania są również znacznie wydajniejsze. Pierwszy zestaw nie będzie działał dla dynamicznie dodawanych elementów i jest znacznie gorszy dla wydajności.

on()Funkcja jQuery nie wprowadza żadnej nowej funkcjonalności, która jeszcze nie istniała, jest jedynie próbą standaryzacji obsługi zdarzeń w jQuery (nie musisz już wybierać między aktywowaniem, wiązaniem lub delegowaniem).

Metody bezpośrednie i .delegatesą doskonałymi interfejsami API .oni nie ma zamiaru ich zastępować.

Preferowane są metody bezpośrednie, ponieważ kod będzie mniej rygorystyczny. Natychmiastowy błąd pojawi się, gdy pomylisz nazwę zdarzenia zamiast cichego błędu. Moim zdaniem łatwiej jest też pisać i czytać clickniżon("click"

.delegateJest lepsza .onz powodu kolejności argument za:

$(elem).delegate( ".selector", {
    click: function() {
    },
    mousemove: function() {
    },
    mouseup: function() {
    },
    mousedown: function() {
    }
});

Od razu wiesz, że jest delegowany, ponieważ, no cóż, mówi delegat. Widoczny jest również selektor.

Nie .onjest od razu jasne, czy jest nawet delegowane, i musisz spojrzeć na koniec selektora:

$(elem).on({
    click: function() {
    },
    mousemove: function() {
    },
    mouseup: function() {
    },
    mousedown: function() {
    }
}, "selector" );

Nazewnictwo .bindjest naprawdę okropne i ma wartość nominalną gorszą niż .on. Ale .delegatenie można wykonywać zdarzeń nieprzekazanych, a są zdarzenia, które nie mają bezpośredniej metody, więc w rzadkich przypadkach, takich jak ten, można go użyć, ale tylko dlatego, że chcesz zachować czysty rozdział między zdarzeniami delegowanymi i nieprzekazanymi.

Jeśli spojrzysz na kod źródłowy $.fn.bind, przekonasz się, że jest to tylko funkcja przepisywania dla on:

function (types, data, fn) {
    return this.on(types, null, data, fn);
}

http://james.padolsey.com/jquery/#v=1.7.2&fn=$.fn.bind

Z dokumentacji jQuery:

Począwszy od jQuery 1.7, metoda .on () jest preferowaną metodą dołączania procedur obsługi zdarzeń do dokumentu. We wcześniejszych wersjach metoda .bind () służy do dołączania modułu obsługi zdarzeń bezpośrednio do elementów. Programy obsługi są dołączone do aktualnie wybranych elementów w obiekcie jQuery, więc te elementy muszą istnieć w momencie wywołania funkcji .bind (). Aby uzyskać bardziej elastyczne wiązanie zdarzeń, zobacz omówienie delegowania zdarzeń w .on () lub .delegate ().

http://api.jquery.com/bind/

Począwszy od Jquery 3.0 i nowszych. .Indb jest przestarzałe i wolą zamiast niego używać .on. Jak @Blazemonger odpowiedział wcześniej, że może zostać usunięty i na pewno zostanie usunięty. W starszych wersjach .bind wywoływałby również wewnętrznie .on i nie ma między nimi żadnej różnicy. Więcej informacji można znaleźć w interfejsie API.

Dokumentacja jQuery API dla .bind ()