2013-04-04 155 views
0

AFAICT這應該工作,但它不會。使用jQuery 1.9.0,我有以下幾點:.on()不適用於生成的元素

<html> 
    <head> 
     <script type="text/javascript" src="js/libs/jquery-1.9.0/jquery.min.js"></script> 
     <script type="text/javascript"> 

      $(document).ready(function() { 
       $("button").click(function() { 
        $("#area").html("<p>click me</p>"); 
       }); 

       $("p").on("click", function() { 
        alert($(this).text()); 
       }); 
      }); 

     </script> 
    </head> 
    <body> 
     <p>some text</p> 
     <button>Create me</button> 
     <div id="area"></div> 
    </body> 
</html> 

爲什麼點擊「一些文字」把警報,但點擊生成的「單擊我」呢?我認爲.on()的重點是在動態生成的代碼上啓用事件處理程序。根據Click event doesn't work on dynamically generated elements這應該工作,但它沒有。請參閱http://jsfiddle.net/ymUYy/1/

+0

[請閱讀jQuery的'。對()'文檔,其中代表團清楚的解釋(http://api.jquery.com/on/) – Sparky 2013-04-04 01:46:06

回答

3

.on()不是.live()的替代替代品。您需要使用事件代表團語法:

$('#area').on('click', 'p', function() { 
    ... 
}); 
+4

關於委託知道的重要一點是,您應用'.on()'的元素在您調用時必須存在,第二個參數中指定的元素可以動態添加。 – Barmar 2013-04-04 01:46:12