JQuery персистентный селектор CSS, эквивалентный .live () - PullRequest
Новая
       6

JQuery персистентный селектор CSS, эквивалентный .live ()

4 голосов
/ 06 апреля 2010

Итак, сегодня я только что натолкнулся на функцию «live ()», которая связывает любые будущие и прошлые элементы с любым событием, которое вы выберете, например, «onclick».

Сейчас мне приходится настраивать кнопки, подобные приведенным ниже, каждый раз, когда я загружаю новую кнопку через ajax ... 

$('a.btn.plus').button({icons:{primary:'ui-icon-plusthick'}});
$('a.btn.pencil').button({icons:{primary:'ui-icon ui-icon-pencil'}});
$('a.btn.bigx').button({icons:{primary:'ui-icon ui-icon-closethick'}});

Итак, вместо того, чтобы вызывать эти строки каждый раз, когда я использую ajax для добавления новой кнопки, есть ли аналогичный способ сообщить JQuery о настройке моих кнопок В ЛЮБОЕ время я добавляю новые?

Спасибо за любую помощь!

Ответы [ 3 ]

2 голосов
/ 06 апреля 2010

Ммм не очень. Но есть функция .ajaxSuccess(), которая запускается всякий раз, когда вызов Ajax успешен. Так что вы могли бы сделать: 

$('body').ajaxSuccess(function() {
    $('a.btn.plus').button({icons:{primary:'ui-icon-plusthick'}});
    $('a.btn.pencil').button({icons:{primary:'ui-icon ui-icon-pencil'}});
    $('a.btn.bigx').button({icons:{primary:'ui-icon ui-icon-closethick'}});
});

Но это будет работать на любых ссылках с классами, а не только на новых. Но если вы добавите их за раз (то есть не сразу a.btn.plus), вы сможете использовать селектор :last (a.btn.plus:last).

Вы также можете создать функцию и только из функций обратного вызова: 

function links() {
   $('a.btn.plus').button({icons:{primary:'ui-icon-plusthick'}});
   $('a.btn.pencil').button({icons:{primary:'ui-icon ui-icon-pencil'}});
   $('a.btn.bigx').button({icons:{primary:'ui-icon ui-icon-closethick'}});
}

и в вызове Ajax: 

$.ajax({
   //...
   success: function(msg){
      links();
   }
});

Таким образом, вы можете передать родительский элемент в функцию, чтобы найти ссылку только внутри этого элемента (чтобы код работал только с новыми ссылками).

Последний вариант будет генерировать пользовательское событие, но в конце это будет похоже на просто вызов функции в вашем случае, так что вы получите немного.

1 голос
/ 06 апреля 2010

Вы также можете использовать делегат в своей функции успеха 

$("body").delegate("a.btn", "hover", function(){
$(this).toggleClass("hover");
});
0 голосов
/ 05 июля 2010

Существует плагин Jquery под названием livequery, который отвечает вашим требованиям.

Мне нравится думать об этом плагине как Jquery .live (), но без необходимости события ('click') и т. Д.

Вы можете найти больше информации здесь //

Jquery - плагин Live Query

...