JQuery auf Ereignis ist nicht bindend für nicht vorhandene Elemente

Question

Ok hier das jsfiddle Beispiel

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

Wie Sie sehen Sie, wenn Sie es schweben wird Mouseover-Ereignis nicht ausgelöst

wie kann ich dieses Problem lösen Problem ?

ich bin mit 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

Sie haben „delegieren“ zu verwenden, wie dies („live“ zu liefern) $('body').on('mouseover', '#super', function (event) {

Answer 2

Die div Sie Onclick erstellen möchten, mit dem '</div>' ist nicht Tag geschlossen.

Was ist, wenn Sie den folgenden Code versuchen:

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

Answer 3

Sie auch die Maus über Ereignis wickeln können in einer Funktion, und rufen Sie es auf, wenn Sie neue Elemente hinzufügen, die betroffen sein sollen. Auf diese Weise wird das Problem, auf das WickyNilliams hingewiesen hat, keinen Einfluss auf dich haben.

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