左側或右側點擊選擇哪個元素？

我有與該模板創建幾個文件夾圖標：左側或右側點擊選擇哪個元素？

<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

左側或右側點擊選擇哪個元素？

回答

相關問題