jquery live hover

161

Я використовую наступний код jquery, щоб показати контекстну кнопку видалення лише для рядків таблиці, за якими ми маємо мишу. Це працює, але не для рядків, які були додані js / ajax на льоту ...

Чи є спосіб зробити цю роботу за допомогою подій наживо?

$("table tr").hover(
  function () {},
  function () {}
);

jquery live jquery-1.4

— Жорре
джерело

245

jQuery 1.4.1 тепер підтримує "наведення" на події live (), але лише з однією функцією обробника подій:

$("table tr").live("hover",

function () {

});

Крім того, ви можете надати дві функції: одну для мишоловки і одну для миші:

$("table tr").live({
    mouseenter: function () {

    },
    mouseleave: function () {

    }
});

— Філіп Лейбаерт
джерело

Це все ще не працює для мене. Я спробував це зробити: де я помиляюся? > $ ('таблиця tr'). live ('навести курсор', функція () {$ (this) .find ('. deletebutton'). toggle ();});

— Шріпад Кришна

1

це неправильно і не працює. дивіться заголовок "Кілька подій" під документацією для live: api.jquery.com/live

— Jason

34

Станом на jQuery 1.4.2, .live ("наведення курсора") еквівалентно .live ("миші за миші"), а не .live ("mouseenter mouseleave") - див. Bugs.jquery.com/ticket/6077 Отже. live ("mouseenter mouseleave", function () {...}), або .live ("mouseenter", function () {...}). live ("mouseleave", function () {...})

— aem

2

дякую @aem, для мене це спрацювало: $ ("tr tr"). live ("mouseenter", function () {...}). live ("mouseleave", function () {...});

— jackocnr

3

Відповідно до сторінки документації JQuery.live написано, що вона використовується .onзамість цього. "Станом на jQuery 1.7, метод .live () застарілий. Використовуйте .on () для приєднання обробників подій."

— Johnt podjeter

110

$('.hoverme').live('mouseover mouseout', function(event) {
  if (event.type == 'mouseover') {
    // do something on mouseover
  } else {
    // do something on mouseout
  }
});

http://api.jquery.com/live/

— дмитко
джерело

Працював і для мене. +1 Спробував виконати версію Філіппа, як за допомогою миші, так і для миші, - не працювало. Але це зробив. Дякую!

— eduncan911

.liveзараз застаріло, див. відповідь Андре про метод заміни зараз.

— Johnt предприниматель

1

Використання тут mouseoverі mouseoutподій призведе до того, що код буде постійно стріляти, коли користувач переміщає мишу всередині елемента. Я думаю , mouseenterі mouseleaveє більш придатними , так як він буде стріляти тільки один раз при вході.

— Johnt предприниматель

60

.live() був застарілий станом на jQuery 1.7

Використовуйте .on()замість цього і вкажіть селектор нащадків

http://api.jquery.com/on/

$("table").on({
  mouseenter: function(){
    $(this).addClass("inside");
  },
  mouseleave: function(){
    $(this).removeClass("inside");
  }
}, "tr");  // descendant selector

— Андре
джерело

6

це працює бездоганно, як у jquery 1.9. всі живі та делегатські рішення ВИДАЛЕНО! було б дивним, якби хтось міг не прийняти прийняту відповідь і прийняти цю замість цього.

— jascha

5

Станом на jQuery 1.4.1, подія наведення курсора працює live(). По суті, він просто пов'язується з подіями mouseenter та mouseleave, що також можна робити з версіями до 1.4.1:

$("table tr")
    .mouseenter(function() {
        // Hover starts
    })
    .mouseleave(function() {
        // Hover ends
    });

Це вимагає двох прив'язок, але працює так само добре.

— Тату Ульманен
джерело

5

Цей код працює:

    $(".ui-button-text").live(
        'hover',
        function (ev) {
            if (ev.type == 'mouseover') {
                $(this).addClass("ui-state-hover");
            }

            if (ev.type == 'mouseout') {
                $(this).removeClass("ui-state-hover");
            }
        });

— Хорхе Е. Кардона
джерело

2

Що таке "ui-state-hover"? Як це стосується оригінального запитання користувача?

— ІгорГанапольський

2

ПОПЕРЕДЖЕННЯ: Сума покарань за виконання під час наведення курсору наживо. Особливо це помітно на великій сторінці в IE8.

Я працюю над проектом, де ми завантажуємо багаторівневі меню з AJAX (у нас є свої причини :). У будь-якому випадку, я використовував живий метод для наведення курсора, який чудово працював у Chrome (IE9 зробив добре, але не чудово). Однак в IE8 це не лише сповільнило меню (вам довелося зависнути пару секунд, перш ніж воно впаде), але все на сторінці було болісно повільним, включаючи прокрутку та навіть перевірку простих прапорців.

Пов'язування подій безпосередньо після їх завантаження призводило до адекватної продуктивності.

— Брайан
джерело

2

корисний, але більше коментар, ніж відповідь.

— mikemaccana