Связанные события теряются при использовании jQuery.append - PullRequest
Новая
       17

Связанные события теряются при использовании jQuery.append

0 голосов
/ 18 апреля 2011

У меня есть простой код, подобный этому http://jsfiddle.net/9braK/2/

$(function(){

$('body').append(
    $("<a/>").attr({ "id": "foo", "href":"#" })
             .text("click me")
             .live("click",function(e){
                e.preventDefault();
                alert("Hello World!");
             })
  );
});

Согласно документам это должно работать, верно?

Ответы [ 2 ]

2 голосов
/ 18 апреля 2011

Методы обхода DOM не являются поддерживается для поиска элементов для отправки жить(). Скорее, метод .live () всегда следует вызывать сразу после селектор, как в примере выше.

Источник

Так что единственная проблема в вашем коде - это использование live(). "<a/>" не является селектором, и, как работает live(), он не сможет найти соответствующие элементы. Если вы просто используете .click(), это, конечно, будет работать безупречно.

Вы можете использовать что-то вроде 

$('body')
  .append(
    $("<a/>")
      .attr({ "id": "foo", "href":"#" })
      .text("click me")
    )
  )
  .delegate("#foo", "click", function(e){
                e.preventDefault();
                alert("Hello World!");
             });

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

0 голосов
/ 18 апреля 2011

Это работает: 

$(function(){
  // Add the click event for all future elements having the id #foo
  $('#foo').live("click",function(e){
                    e.preventDefault();
                    alert("Hello World!");
                 });

    $('body').append(
        $("<a/>").attr({ "id": "foo", "href":"#" })
                 .text("Continue ")
    );
});
...