Как применить функцию jQuery live () к этому коду?

Question

Как уже упоминалось, я хотел бы знать, как я могу применить функцию live () к этому коду.

Этот код будет вставлен с помощью JavaScript:

<a class="link" href="url"><span>This content is hidden</span></a>  

Это javascript, который должен быть активен:

$('.link').append('<span class="hover"></span>').each(function () {
      var $span = $('> span.hover', this).css('opacity', 0);
      $(this).hover(function () {
        $span.stop().fadeTo(500, 1);
      }, function () {
        $span.stop().fadeTo(500, 0);
      });
    });

Простое добавление .live (). не похоже, чтобы сделать трюк

любая помощь приветствуется!

Answer 1

Я не знаю точно, что вы пытаетесь сделать, но я делаю следующее предположение: Вы добавляете тег «a», а затем хотите добавить «span», который при наведении мыши имеет эти события.

Это не "вживую", и я предполагаю, что вы знаете, когда добавляете тег 'a'. Когда вы сделаете это, просто вызовите функцию AddEvents для добавления, дайте дочернему элементу немного CSS, затем примените «hover» к вновь добавленному дочернему элементу. Нечто подобное должно работать, не причудливо, но должно работать:

function AddEvents()
{
    $('.link').append('<span class="hover"></span>');
    var $span = $('.link span.hover');
    $span.css('opacity', 0);
    $span.hover(function()
    {
        this.stop().fadeTo(500, 1);
    }, function()
    {
        $span.stop().fadeTo(500, 0);
    });
};

// call the function when needed
AddEvents();

ПРИМЕЧАНИЕ. Если вы знаете только что добавленный контекст «а», вы можете передать его через AddEvents (); вызов функции и работа в таком виде:

AddEvents($(this));//or the selector for that 'a' link

function AddEvents(scopeItem)
{
    scopeItem.append('<span class="hover"></span>');
    var $span = $('span.hover', scopeItem);
    $span.css('opacity', 0);
    $span.hover(function()
    {
        this.stop().fadeTo(500, 1);
    }, function()
    {
        $span.stop().fadeTo(500, 0);
    });
};