Skip to content

Instantly share code, notes, and snippets.

@sapegin
Created July 13, 2012 06:24
Show Gist options
  • Save sapegin/3103107 to your computer and use it in GitHub Desktop.
Save sapegin/3103107 to your computer and use it in GitHub Desktop.
Controls helper
/**
* Controls
*
* <span data-trigger="slider-next" data-recipient=".portfolio">Next</span>
*/
$(document).click(function(e) {
var target = e.target;
if (target.getAttribute('data-trigger') && target.getAttribute('data-recipient')) {
target = $(target);
$(target.data('recipient')).trigger(target.data('trigger'));
e.preventDefault();
}
});
@mistakster
Copy link

Эта штука не будет работать с разметкой типа:

<span data-trigger="slider-next" data-recepient=".portfolio"><em>Next</em></span>

из-за того, что инициатором события будет em.

Гораздо лучше что-то типа такого:

$(document).on("click", "[data-trigger][data-recepient]", function (e) {
    $($(this).data("recepient")).trigger($(this).data("trigger"));
    e.preventDefault();
});

…ну, и как бы короче :) Я только не ручаюсь за производительность. Возможно матчинг по атрибутам — не сильно быстрая штука. Нужно делать бенчмарк.

@sapegin
Copy link
Author

sapegin commented Jul 13, 2012

Спасибо за предложение! Когда столкнусь с такой разметкой, попробую.

@mistakster
Copy link

Да, универсальность съедает производительность. Можешь потыкать тест. Но, деградация не такая уж и критическая, чтобы отвергать этот вариант.

@sapegin
Copy link
Author

sapegin commented Jul 13, 2012

Ну да, не такая уж большая разница. Но ещё надо бы добавить вариант, где target.getAttribute('data-trigger') тоже на jQuery. Тогда разница должна быть ещё меньше.

@mistakster
Copy link

В этом нет нужды. Селекторы обслуживает Sizzle, который не обращается к jQuery.

Можно ещё попробовать расширить возможности селекторов jQuery и матчить елементы не по атрибутам, а сразу по связанным с ним данным. Как это скажется на производительности кода я, опять же, достоверно сказать не могу.

@sapegin
Copy link
Author

sapegin commented Jul 15, 2012

А Сизл, по-твоему, магию использует? :)

@mistakster
Copy link

Нет, что ты. Я хотел сказать, что $(el).attr("data-trigger") и $("[data-trigger]") обрабатываются абсолютно не связанными друг с другом участками кода.

@sapegin
Copy link
Author

sapegin commented Jul 15, 2012

Но оба создают объект jQuery, который не создаётся в исходном варианте.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment