使用jquery覆蓋div不可點擊

我有一個問題，我在頁面上的菜單上有一個半透明的div，我想讓該div點擊。使用jquery覆蓋div不可點擊

CSS屬性指針事件不是一個選項，因爲我需要生成有效的CSS。我嘗試過：

event.preventDefault(); 
event.stopPropagation();

沒有運氣，「底層」上的div不會被點擊。

這裏是我的一個簡化版本代碼：

<div id="menuContainer"> 
<div id="menu"> 
//here comes all the items of my menu 
</div> 
</div> 
<div id="shadow"> 
</div>

的CSS：

#menuContainer { 
position: absolute; 
top: 0px; 
z-index: 0; 
height: 200px; 
} 
#menu { 
width: 300px; 
height: 30px; 
margin: 0 auto; 
position: absolute; 
z-index: 10; 
top: 160px; 
} 
#shadow { 
position: absolute; 
z-index: 1; 
top: 150px 
height: 200px; 
}

是不是一種選擇，爲我改變的z索引或佈局，只是我需要的時候我點擊陰影，點擊「重新傳輸」到菜單中。

來源

2011-12-07 IAmJulianAcosta

據我所知，這是不可能的，在不支持的瀏覽器中不能替代指針事件。你將不得不改變你的網站佈局，z-index不會幫你點擊一個元素。只有我能想到的是抓住鼠標指針位置並觸發覆蓋元素後面的相應元素，但對於基本上是設計缺陷的東西而言，這太過複雜。 – adeneo

你看過使用jQuery的click（）函數嗎？

http://api.jquery.com/click/

你可以捕捉到最頂端的元素上的click事件，模擬下面的元素上點擊，然後返回向停止原來的點擊。

來源

2011-12-07 02:30:16 kwerty

你可以做這樣的事情

$('#shadow').click(function() { 
    $('#menu').trigger('click'); 
});

陰影元素通過單擊事件上的菜單。

如果您還需要中繼鼠標位置，請查看Mouse Position教程。

來源

2011-12-07 02:34:10 declan

但如果我觸發點擊菜單，它會自動觸發事件到內部元素？我有：

– IAmJulianAcosta

不！只有#menu元素會被觸發，除非你想方設法找出你的陰影元素後面的菜單部分，然後觸發該特定元素。 – adeneo

是的，我同意@adeneo這整個方法可能是一個設計缺陷。你爲什麼需要在菜單上放一些東西？你可以設置菜單項的背景圖像，或者類似的東西嗎？ – declan

使用jquery覆蓋div不可點擊

回答

相關問題