javascript stoppropagation does not使用ajax .load

我用.stopPropagataion()停止在<li class="article">冒泡時點擊<a>標籤。javascript stoppropagation does not使用ajax .load

$(document).ready(function(){ 
    $(".article a").click(function(e) { 
     e.stopPropagation(); 
    }); 
});

有了這個HTML：

<li class="article" onlick="javascript:somefunction();"> 
    <div id="div_id"> 
     <a>Some link</a> 
    </div> 
</li>

一切工作正常，但後來我用$('#div_id').load("div_html.html")動態加載一些內容到DIV。現在我的.stopPropagation()不停止冒泡。爲什麼它不再工作？

來源

2011-11-30 user1073201

嘗試'返回false;'，而不是'即stopPropagation（）;' –

Re'onlick =「javascript：somefunction（）;」'，三個問題：1）它是'onclick'，而不是'onlick'（你錯過了'c'），2）在事件處理程序屬性上不使用'javascript：'僞協議，只使用'href's; 3）最好避免將舊式DOM0處理程序（事件處理程序屬性）與新式DOM2代碼（使用jQuery附加您的處理程序）混合。 –

問題是，當您更新div的內容時，會銷燬其中的所有元素（包括附加到它們的任何事件處理程序）。在您的代碼運行時，您的代碼正在div上的a元素上掛接click事件; div中的新元素a將不會連接。

在你的情況，你就要去使用delegate（live example, with load）更好：

$(document).ready(function(){ 
    $(".article div").delegate("a", "click", function(e) { 
     e.stopPropagation(); 
    }); 
});

掛接在div代替click。當點擊發生時，它會從鏈接跳到div，在那裏由jQuery創建的點擊處理程序檢查它是否實際上是對任何a元素的點擊。如果是這樣，它會停止點擊。

在jQuery 1.7中，新的推薦語法是on代替：

$(document).ready(function(){ 
    $(".article div").on("click", "a", function(e) { 
     e.stopPropagation(); 
    }); 
});

注意參數的順序是從delegate不同，但比它做同樣的事情等。

我建議你避免與新型DOM2代碼（處理程序連接使用jQuery）相結合舊式DOM0處理程序（事件處理程序屬性）。在許多瀏覽器中，這兩種機制有些分離，可能無法像你想的那樣很好地一起玩。

兩個在此的其他意見：

onlick="javascript:somefunction();"

這是onclick，不onlick（你錯過了c）
您不要在事件處理程序的屬性使用javascript:僞協議，只有href s。只要刪除那部分。（？爲什麼它不引起錯誤，因爲純屬巧合，它是有效的JavaScript —你定義一個label你從不使用。）

來源

2011-11-30 11:58:38

你確定這有效嗎？點擊處理程序在冒泡到'.article'時執行，因爲它已附加到該元素，所以它不會阻止事件冒泡到'.article'，因爲它太遲了。 http://jsfiddle.net/3vHty/ – pimvdb

@pimvdb：謝謝，我意識到，因爲我正在添加鏈接，所以我將它移到了'div'。 –

感謝您的意見和幫助。 1）它仍然不起作用。 2）關於onlick（很明顯，我拼錯了，感謝指出了），3）你推薦什麼，而不是onclick =「javascript： – user1073201

javascript stoppropagation does not使用ajax .load

回答

相關問題