删除父项而不单击子项

Question

我在A层内有A层和B层

http://jsfiddle.net/PhZhY/

是否可以使用jQuery函数remove()在A层上单击而不在B层上删除A层？

Answer 1

$("body").on("click", ".a1", function(e) {
    if (this === e.target) $(this).remove();
});​

DEMO： http://jsfiddle.net/PhZhY/1/

Answer 2

如果您希望.b1保留并仅删除.a1

$('.a1').live('click',function() {
     $(".b1", this).unwrap();
});

http://jsfiddle.net/PhZhY/3/

即使您不知道任何子元素，也可以删除该div：

$('.a1').live('click',function() {
     $(".a1 :first-child").unwrap();
});

http://jsfiddle.net/PhZhY/5/

如果您想要移除.a1 div，如果未在.b2内点击这就是您需要的内容：

$('.a1').live('click',function() {
     $(".a1 :first-child").unwrap();
});

$('.b1').live('click',function() {
 throw "stop execution";
});​

http://jsfiddle.net/PhZhY/6/

根据@Rick Calder的评论： 如果您愿意，可以使用.addClass()更改课程，或使用.removeClass()删除课程。

Answer 3

以下是我如何阅读问题：

如果点击.b1，则不会发生任何事情。如果您点击.a1，则应将其删除。

如果这是意图，这里是jQuery：

$('.b1').click( function(e){
  e.stopImmediatePropagation();
});

$('.a1').click( function(){
  $(this).remove();
});

这是一个jsbin。注意：css，html无耻地从@ Vision的jsFiddle中偷走了