左侧或右侧点击选择哪个元素？

我有与该模板创建几个文件夹图标：左侧或右侧点击选择哪个元素？

<div id='folderTemplate' class="template openclosed_folder_icon subfolder" style="position:absolute; top:'30'; left:'100';"> 
     <img class="folder_icon" src="images/folder_closed.png" alt="closed folder" /> 
     <div class="folder_label" >name</div> 
     <img class='folder_redX' src='images/redX.png' alt='redX' title='Delete this gallery' /> 
</div>

的文件夹是这样的：

如果我用鼠标左键单击大多数文件夹中，e.target自带转化为jQuery是第一个<img>元素，上面刚好低于<div>开头的标记。如果我打开Chrome Debugging右键单击这些文件夹，要检查它们，选择的元素是第一个元素<img>。但其中一个文件夹给我的外部<div>，当我离开点击它或右键单击它。有没有人有一个想法是怎么回事？什么控制通过左键或右键实际选择哪个元素？

感谢

来源

2016-07-27 Steve

我最好的猜测是，该<img />元素可能有不可选择的样式：

pointer-events: none;

上面的代码将确保鼠标指针不能看到图像的全部或任何元素的原因。

检查了这一点的位置：

input {padding: 25px 35px;} 
 
div {pointer-events: none; position: relative; top: 15px; background: #fff; display: inline-block; left: -205px; z-index: 9999;}

<input type="button" value="Hello, World! Click Me?" /> 
 
<div>See through! Click on me!</div>

在上面的代码中，如果您尝试点击<div />你不会是能够做到的，并且指针事件直接进入到它后面的元素。从逻辑上说，鼠标根本看不到<div />！大部分原因是因为它背后的CSS，你没有提供，可能会回答这个问题！ :)

为了确定，我还在<div />中添加了z-index: 999;。仍然<div />是不可选的。

来源

2016-07-27 00:24:08

我解决了这个问题，但这不是我想的。问题是，对于文件夹左侧的模板DIV延伸太远权重叠右边的文件夹：

所以，当我以为我点击图片文件夹，我其实是点击Gallery文件夹的模板div，它阻止鼠标点击到达图像文件夹。点击不会启动图像文件夹的模板div。它会调出覆盖图像文件夹的Gallery文件夹的模板div。解决方法是使模板div的宽度足以容纳文件夹名称，以便不会有任何文件夹重叠。

来源

2016-07-27 16:31:51 Steve

左侧或右侧点击选择哪个元素？

回答

相关问题