刪除項目通過點擊一個按鈕，「刪除方法」

Question

概述：

我使用的砌體層疊網格佈局庫和添加刪除砌築方法。 該方法允許點擊項目的任何部分 - >刪除它 - >並很好地安置佈局。

問題：

我想通過點擊項目內的特定區域（即，按鈕）以刪除項目（<div class="item 1"></div>「粉紅盒」）僅。

我試圖在JavaScript文件中操作函數，但沒有成功找到我的問題的解決方案。 （我開始了第一次前建立一些網站2個月，所以在JS或JQ的經驗非常少）

問：

你有什麼大概的瞭解，我怎麼能解決這個問題？

這裏是一個鏈接的jsfiddle，以顯示我想達到什麼樣的簡要概述：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> 

的JavaScript

// 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

我的天堂我還沒有檢查classie.js，因爲我不知道它是否會回覆您需要通過點擊按鈕來刪除該項目。只要調整您的Fiddle有：

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

如果你已經有了卸下襬臂-BTN在實際的DOM，它沒有必要從$（文件）委託點擊事件給卸下襬臂式按鍵，所以如果是這種情況，這可以簡化爲

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

調整Fiddle爲這個版本。