JQuery 제거 수신기를 포함한 요소 추가

Question

요소를 추가하는 가장 좋은 방법은 무엇입니까? div, 자신을 제거하는 링크? 이 거의 작동합니다

function displayElements(objekt) { 
    $('#container').empty(); 
    for(var key in objekt) { 
     if(objekt.hasOwnProperty(key)) { 
      $('#container').append('<div id="' + key + '">' + 
       key + 
       '<a id="del' + key + '">delete'</a></div>'); 
      $('#del' + key).click(function() { 
       delete objekt[key]; 
       displayElements(objekt); 
      }); 
     } 
    } 
} 

이상한 효과가 삭제 링크를 내가 클릭 상관없이, 항상 마지막 요소가 삭제됩니다 있다는 것입니다. 그 이유는 무엇이며이를 달성하는보다 우아한 방법이 있습니까?

감사합니다, Eriq

당신은 그와 함께 대체 할 수

Answer 1

:

// build your markup 
function displayElements(objekt) { 
    var container = $('#container').empty(); 
    for (var key in objekt) { 
     if (objekt.hasOwnProperty(key)) { 
      container.append('<div id="' + key + '">' + key + '<a id="del' + key + '">delete< /a></div > '); 
     } 
    } 
} 


displayElements(objekt); 

// bind to all anchors who's ids start with 'del' 
$("#container").on("click", "a[id^='del']", function() { 
    $(this).remove(); 
}); 

Answer 2

내가 루프에서 이벤트 물건을 이동 것 :

function displayElements(objekt) { 
    $('#container').empty(); 

    for (var key in objekt) { 
    if (objekt.hasOwnProperty(key)) { 
     var $div = $('<div />'); 
     $div.prop('class', 'delete'); 
     $div.append($('<a />').attr('id', 'del' + key).text('delete')); 
    } 
    } 
} 

$('.delete').on('click', 'a[id^="del"]', function() { 
    // Delete your stuff 
});