单击时动态创建

元素-Dynamicallycreate

elementonclick

I have the following on html

我在html上有以下内容

    
    

    




     
         
         

         
Static li element
This is a Static li element
         
   
     

I am trying to get write a function to handle the event when any of the list element get clicked. But it doesn't seems to be triggering at all when I click on the

$('#addressList').on('click', 'li', function() {
    alert("clicked");
    alert( $(this).text() );

});

The

listCOntents= $("
" + addresses[i].lable + "
");
jQuery('#addressList').append(listContents);

And I verified through my browser's console that they are being created correctly as such

我通过浏览器的控制台验证了它们是否正确创建

outerHTML: "
6 Cashew Crescent
6 Cashew Crescent. (S)679751
"

Let's ignore about the dynamic list first. The thing is even my static list element are not responding to the event handler upon click. Have been trying to figure out the problem for a couple of hours now..

我们先忽略动态列表。甚至我的静态列表元素在点击时没有响应事件处理程序。一直试图找出问题几个小时了..

I have created a jsfiddle for my static li element not working https://jsfiddle.net/tmu50t9z/

我为我的静态li元素创建了一个jsfiddle不工作https://jsfiddle.net/tmu50t9z/

jsfiddle to my whole code > https://jsfiddle.net/8wwnx64x/

jsfiddle to my code> https://jsfiddle.net/8wwnx64x/

2 个解决方案

$('#addressList li').on('click', function() {
    alert("clicked");
    alert( $(this).text() );

});

 
Add LI

var a=0;
$('#aaa').click(function() {
 $('#addressList').append('
6 Cashew     Crescent
6 Cashew Crescent. (S)679751
');
 a++
});
$( "#addressList" ).on( "click", "li", function( event ) {
    event.preventDefault();
    console.log( $( this ).text() );
});