删除项目通过点击一个按钮，“删除方法”

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为这个版本。