2012-07-04 14 views
1

jquery를 사용하여 div 요소를 추가하고 제거하려고합니다. div 요소를 추가해도 문제가 없지만 div 요소를 제거하면 작동하지 않습니다. 이렇게 구현했습니다.div 요소 제거가 작동하지 않습니다.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
<title>jQuery</title> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 

<script type="text/javascript"> 
var count = 0; 
$(document).ready(function(){ 
    $('p#add_field').click(function(){ 
     count += 1; 
     $('#container').append(
       '<div><div><label><strong>Link' + '</strong></label><br />' 

       + '<input id="field_' + count + '" name="fields[]' + '" type="text" /><br /></div>' 
       +'<div><a href="#" class="remove">Remove selection</a></div></div> '); 

    }); 

    $('.remove').on('click', function() { 
     $(this).parent().parent().remove(); 
     return false; 
    }); 

}); 
</script> 

<body> 

     <div id="container"> 
      <p id="add_field"><a href="#"><span>&raquo; Add your favourite links.....</span></a></p> 
     </div> 

</body> 
</html> 

누군가가 해결책을 알고 있다면 나를 도와주세요 !!!

답변

2

$('.remove').on('click',function() {으로 전화하면 항목이 동적으로 생성되며 존재하지 않습니다.

시도는 다음과 같이 스크립트를 수정 :

$('#container').on('click','.remove',function() { 
    $(this).parent().parent().remove(); 
    return false; 
}); 
+0

작업을 마치 마법처럼 :) – Rajul

관련 문제