0

在我的项目中，我需要创建一个 html5 CMS，我的问题是如何定位重叠元素中的元素？喜欢

<div id='L1'>
  <!--some text -->
  <div id='L2'>
    <!--some text -->
    <div id='L3'>
         <!--some text -->
    </div>
    <div id='L4'>
         <!--some text -->
    </div>
  </div>
</div>

我想针对 L1、L2、L3 和 L4。现在问题来了，我可以使用 $(L1, L1 *) 来定位 L1 中的每个元素，包括 L1 并为它们绑定“click”事件处理程序。

但是，当我单击时，比如说 L4，不仅会出现 L4 的内容，还会出现 L1 和 L2。我想查看仅包含该元素的内容，不需要 is 的父级，我该怎么办？

更新：我通过 ajax 加载一个 Temple 容器，并为它们绑定事件处理程序

$('#load_area').load(file,function(){
$('#load_area *').click(
    function(){
        $('#edit_area').append($(this).html());//display what I have clicked
    }
);
});
4

1 回答 1

2

您的代码以这种方式运行的原因是您的事件正在冒泡 DOM，为了防止这种行为，您可以执行以下操作之一

$('#load_area').load(file,function(){
$('#load_area *').click(
    function(event){
        event.stopPropagation();
        $('#edit_area').append($(this).html());//display what I have clicked
    }
);
});

或者

$('#load_area').load(file,function(){
$('#load_area *').click(
    function(){
        $('#edit_area').append($(this).html());//display what I have clicked
        return false; //event.stopPrpagation() + event.preventDefault()
    }
);
});
于 2012-07-16T07:11:06.677 回答