Jquery na razie nie jest wiążąca dla nieistniejących elementów

Question

Ok tu jsfiddle przykład

http://jsfiddle.net/HTjCT/1/

Jak widać cię po najechaniu nie jest wypalanie mouseover zdarzenia

jak mogę rozwiązać ten problem problem?

używam Jquery 1,9

<div id='superdiv'>Click Me</div> 


$(function() { 
    $('#superdiv').on('click', function (event) { 
     $('body').append('<div id="super">another'); 
    }); 
    $('#super').on('mouseover', function (event) { 
     alert('not working'); 
    }); 
}); 

javascript

Answer 1

Trzeba użyć „delegata”, tak (aby dostarczyć „na żywo”) $('body').on('mouseover', '#super', function (event) {

Answer 2

Div chcesz utworzyć onclick, nie jest zamknięta z '</div>' tag.

Co jeśli spróbujesz następujący kod:

$(function() { 
    $('#superdiv').on('click', function (event) { 
     $('body').append(
      $('<div/>',{ 'id' : 'super', 'text' : 'tetet'}).mouseover(function(event) { 
        alert('test'); 
      }) 
     ); 
    }); 
}); 

Answer 3

Można też owinąć myszy nad zdarzenie w funkcji i wywołaj ją za każdym razem, gdy dodasz nowe elementy, na które chcesz wpłynąć. W ten sposób wskazany przez WickyNilliams problem nie wpłynie na ciebie.

$(function() { 
    $('#superdiv').on('click', function (event) { 
     $('body').append('<div id="super">another'); 
     mouse(); 
    }); 
    function mouse() { 
     $('#super').on('mouseover', function (event) { 
      alert('not working'); 
     }); 
    }); 
    mouse(); 
}