제거 항목은 버튼을 클릭하여 "방법 제거"

Question

개요 :

내가 벽돌 캐스 케이 딩 그리드 레이아웃 라이브러리를 사용하고 벽돌이 방법을 제거 추가하고있다. 이 방법을 사용하면 항목 중 부분을 클릭하여 제거 -> 제거하고 멋지게 레이아웃을 유지할 수 있습니다.

문제 :이 항목 내의 특정 영역 (즉, 버튼)을 클릭하여 항목 (<div class="item 1"></div> "핑크 박스") 만을 제거하려는

.

JavaScript 파일 내에서 기능을 조작하려고했지만 내 문제에 대한 해결책을 찾지 못했습니다. (나는 전에 일부 웹 사이트 2개월를 구축하기 위해 처음으로 시작, 그래서 JS 또는 JQ에있는 약간의 경험이)

질문 :

당신은 내가이 문제를 해결 수있는 방법 어떤 거친 아이디어가 있습니까? http://jsfiddle.net/intimur/SfU5T/22/

HTML

<div class="masonry"> 
<div class="item 1"></div> 
<div class="item 2">  
    <div class="remove-btn"> Click here to remove item </div>  
</div> 
</div> 

에게 자바 스크립트를

// http://masonry.desandro.com/masonry.pkgd.js added as external resource 
// added http://rawgithub.com/desandro/classie/master/classie.js 

docReady(function() { 

    var container = document.querySelector('.masonry'); 
    var msnry = new Masonry(container, { 
    columnWidth: 200 
    }); 

    eventie.bind(container, 'click', function(event) { 
    // don't proceed if item was not clicked on 
    if (!classie.has(event.target, 'item')) { 
     return; 
    } 
    // remove clicked element 
    msnry.remove(event.target); 
    // layout remaining item elements 
    msnry.layout(); 
    }); 

}); 

Answer 1

I의 천국 : 여기

내가 달성하고 싶은 무엇에 대한 간략한 개요를 보여 jsfiddle 할 수있는 링크입니다 classy.js를 아직 확인하지 못했습니다. 버튼을 클릭하여 항목을 제거해야했습니다. 다만 조정하여 Fiddle과 :

$(document).on('click', ".remove-btn", function() { 
    msnry.remove($(this).parent(".item")); 
    msnry.layout(); 
}); 

당신은 이미 .remove-btn을 실제 DOM에가, 그것은 $ (문서)에서 .remove 버튼에 클릭 이벤트를 위임 할 필요가 없습니다, 그래서이있는 경우 이 경우 간단해질 수 있습니다

$(".remove-btn").click(function() { 
    msnry.remove($(this).parent(".item")); 
    msnry.layout(); 
}); 

이 버전에서는 Fiddle으로 조정됩니다.