jQuery Event Bubbling，live（），單擊事件不會傳播

我有兩個容器，一個在加載頁面之前不會生成。最後生成的那個（<div class=last></div>）應該出現在第一個上面。它在視覺上掩蓋了第一個。但是，我無法讓「.last」響應live（）點擊事件。它會響應第一個div，但不是最後一個div（再次，視覺上出現在前臺的div）。這讓我瘋狂，頁面上沒有其他點擊事件。需要明確的是，這裏是我頁：jQuery Event Bubbling，live（），單擊事件不會傳播

<body> 
<div class="first">First div</div> 
<script type="text/javascript"> 
// This works 
$('body').append($('<div/>').addClass('last').text('last div')); 
//This does not 
$('.last').live('click', function(e) { 
     alert('hello'); 
}); 
</script> 
</body>

如果我取代「去年」用「首先」它的工作原理，我沒有其他的單擊事件，所以我不明白爲什麼傳播應該停止。我甚至分配了z-index：-1以最後一個。這必須非常簡單，有什麼想法？

CSS的最後一個div：

-moz-box-shadow:0 4px 10px 0 #8B8B8B; 
background-color:white; 
cursor:default; 
margin:0 0 0 2px; 
padding:4px 0; 
position:absolute;

一格，沒有CSS。

編輯：我的DOM結構比上面的例子複雜一點。我是積極的div「最後」是可見的和頂部。下面是該項目的實際DOM結構：

<div> 
<button> (when button is pressed last is created) 
    <span> 
    <div> 
    <div class="last"></div> 
    </div> 
    </button> 
</div> 
<table> 
    <thead> 
    <tr> 
    <td><div class="first"></div></td> 
    </tr> 
    </thead> 
</table>

我相信我想通了，並沒有意識到這一點，直到我張貼了我的整個樹。我覺得很愚蠢。「button」div正在停止傳播，因爲它附帶了一個jquery-ui事件。無論出於什麼原因，Chrome和Firefox都不會呈現狀態更改（即將按鈕顯示爲被按下）。這是因爲「最後一個」div不在按鈕上，而在其下面。但就事件而言，它停在按鈕上。奇怪的是，IE8會顯示按鈕被按下（事件觸發），導致意識到這是錯誤。我完全忘了jQuery-UI被鉤到了按鈕上，這可能會顯示div並阻止它顯示。將按鈕移出按鈕解決了問題。

如果jQuery有某種形式的活動日誌，你會看到整個事件泡泡向上，這將是非常好的。

來源

2010-07-22 KieselguhrKid

你可以發佈定位div的css嗎？ – sje397 2010-07-22 02:48:00

嘗試使絕對div'left：0'，'top：0'和更高的'z-index'，然後在該絕對div的父級上使用'position：relative'。 – Reigel 2010-07-22 02:57:34

因爲沒有名爲body的變量，所以您需要在$(body)塊中有大約body的引號。

$('body').append($('<div/>').addClass('last').text('last div'));

來源

2010-07-22 02:34:41 EndangeredMassa

這是粗糙的複製編輯我的部分，我沒有證明閱讀「這個作品」部分的代碼。感謝您指出。 – KieselguhrKid 2010-07-22 02:37:13

哦，hrm。否則，它似乎對我很好。 – EndangeredMassa 2010-07-22 02:39:20

的確，它似乎工作。我試圖複製你的問題，並失敗：http://jsfiddle.net/nfYsu/。 @KieselguhrKid有沒有其他的東西可以導致這個問題呢？ – karim79 2010-07-22 02:41:29

是.live()應該工作...

嘗試添加邊框到div，看看是否有div是真的存在......

你試過.delegate()？

$('body').delegate('.last', 'click', function(){ 
    alert('hello') 
});

來源

2010-07-22 02:47:28 Reigel

jQuery Event Bubbling，live（），單擊事件不會傳播

回答

相關問題