Живые события jQuery не запускаются для динамического элемента

Question

Почему ни одно из живых (или мертвых) событий, которые я связываю с активацией динамического элемента?

(function ($) {
    $.fn.myPlugin = function () {

    var $filterBox = $("<input type='text'>").live("click", function () {
        alert("Clicked");
    });
    this.before($filterBox); // insert into DOM before current element
    return this; // keep chain
    };
})(jQuery);

Я вызываю myPlugin для нескольких <select> элементов.Я думал, что он будет работать без плагина Live, если я связал его перед добавлением элемента в DOM, но даже живые события не запускаются.Это потому, что у моего элемента нет идентификатора?

---

Редактировать: Следующее также не работает:

var $filterBox = $("<input type='text'>").bind("click", function () {
        alert("Clicked");
});

Answer 1

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

(function ($) {
    $.fn.myPlugin = function () {

    var $filterBox = $("<input type='text'>").click(function () {
        alert("Clicked");
    });
    this.before($filterBox); // insert into DOM before current element
    return this; // keep chain
    };
})(jQuery);

Вы можете попробовать это здесь , или немного короче с .insertBefore():

(function ($) {
  $.fn.myPlugin = function () {    
    $("<input type='text'>").click(function () {
        alert("Clicked");
    }).insertBefore(this);
    return this;
  };
})(jQuery);

Вы можете проверить это здесь .

Answer 2

Метод live работает с селекторами , а не с отсоединенными элементами.
Вы можете обрабатывать обычное (не live) click событие, и оно должно работать нормально.

Answer 3

Решается, не используя глобальные переменные, которые заменяют друг друга, и перебирая каждый элемент с помощью this.each(...):

(function ($) {
    $.fn.myPlugin = function () {
        return this.each(function () {
            // do stuff
        });
    };
})(jQuery);

Answer 4

Может ли это быть просто потому, что "<input type='text'>" не является допустимым HTML? Вы не закрыли свой тег. Однако я не уверен, что jQuery не может закрыть его для вас.

Answer 5

Почему бы просто не связать это?http://jsfiddle.net/9WvpA/