如何在不使用onclick或onmousedown的情況下停止事件傳播

由於限制，即使它是我完全避免的東西，在某些情況下，我必須在achor標籤。如何在不使用onclick或onmousedown的情況下停止事件傳播

（說明：在我的CMS中，我使用了一個富文本編輯器來允許用戶對文本元素進行更改，包括鏈接在某些情況下，需要特定的javascript：調用，並且我完全禁止從鏈接編輯功能（爲了簡化用戶的過程）。然而，作爲鏈接之一似乎反應onClick事件的塊，則事雙火災）

喜歡這張內：

<a href="javascript:doSomething()"></a>

我問題在於這個鏈接在一個已經對onclick e作出反應的容器中發泄。因此我想通過事件對象一起到DoSomething的（）方法，這樣我就可以再使用jQuery的

event.stopPropagation()

方法。

然而不幸的是，似乎傳遞事件對象一起

<a href="javascript:doSomething(event)"></a>

似乎並沒有在所有的工作。 Safari將不會說什麼，而Firefox將報告ReferenceError：事件未定義

我認爲這是因爲href =「」不是腳本啓動屬性（如onclick）。問題是，在這種情況下，我將無法訪問超出我已經做的標籤。

因此我要麼需要

1）一種方法，以將事件對象從href屬性

或

2.）一種方法來阻止內傳遞到doSomething的（）函數事件傳播權在該錨點（在其點擊後）通過其他方式。

謝謝您的任何建設性意見！

來源

2012-10-12 SquareCat

爲什麼不直接使用jQuery'doSomething'連接到'click'事件處理程序？ – ultranaut

這種情況要求純粹使用href屬性進行處理。 – SquareCat

我會接受你的話。 – ultranaut

不能從href屬性停止事件傳播，因爲：

當href代碼執行，它不是一個事件。它只是執行該代碼，類似於「位置黑客」。就像在瀏覽器的地址欄中輸入javascript:doSomething()一樣。
在href代碼執行後事件觸發的鏈接 - 包括冒泡。

您可以在this jsFiddle中看到該行爲。請注意，在執行代碼之前，mouseup，mousedown和click都會鏈接，並在點擊鏈接時觸發容器。

如果有事件偵聽器想阻止，您必須找到另一種方式。

但是，如果您可以附加JavaScript來的文件您可以使用preventDefault()阻止href。

例如：

的jQuery，1.7版本之前：

$("#container a").bind ("mousedown mouseup click", function (e) { 
    e.preventDefault(); 
});

jQuery的1.7和更高：

$("#container a").on ("mousedown mouseup click", function (e) { 
    e.preventDefault(); 
});

或（更好）：

$("#container").on ("mousedown mouseup click", "a", function (e) { 
    e.preventDefault(); 
});

你可以see this last version live at jsFiddle。

來源

2012-10-12 01:51:39

非常感謝你！我只是有同樣的問題。使用onclicks將我所有的標籤轉換爲標籤解決了問題！再次感謝！ – gmustudent

@gmustudent，不客氣，樂意效勞！ –

您可以停止href傳播：http://jsfiddle.net/QE8zt/19/ – SgtPooki

我不知道是否有一種方法來獲取參數，如果你寫你的JavaScript的HREF屬性。但你可以在onclick中得到它，但正如你所說這不是最佳做法：

<a onclick="console.log(arguments)">your link</a>

在參數數組中，你將得到你的事件對象。

這裏是一個演示給你：

http://jsfiddle.net/tEw5J/1/

來源

2012-10-12 01:23:58 Sinan

謝謝，但我無法使用onclick。不幸。 – SquareCat

如果你不能改變鏈接本身（使用onclick），那麼你唯一的選擇是改變容器的onclick處理程序。

你可以這樣做

function containerClickHandler(e) { 
    e = e || event; 
    var el = e.target || e.srcElement; 
    if (el.nodeName === 'A' && someOtherMatchChecks) { 
     // eat event 
    } 
    else { 
     // process event 
    } 
}

來源

2012-10-12 02:01:13

這將是一個選項，但我不能做到這一點，因爲我將不得不從我的CMS適應一些核心代碼，以便它適合一個案例。但是你的方法是完全有效的。給予好評。 – SquareCat

那麼，這是一個老問題，但在我的具體情況我發現它周圍的黑客攻擊，但它可能只適用於情況的子集。我有一個具有onclick的div。但是如果點擊某個div的內部，我不想讓該div的onclick觸發。這是我做的：

function myOnClick() { 

    // loop over all <a>'s, and test if they are hovered over right now. 
    var allLinks = document.links; 
    var dont = 0; 
    for (var i = 0, n = allLinks.length; i < n; i++) { 
    // pure javascript test to see if element is hovered. 
    if(allLinks[i].parentElement.querySelector(":hover") === allLinks[i]) {dont = 1; } 
    }; 

    if(dont)return; 

    // your stuff here, only fires when dont is false. 

}

我瞭解了queryselector伎倆在這裏：https://stackoverflow.com/a/14800287/2295722

來源

2013-11-26 18:46:22 wessel

如何在不使用onclick或onmousedown的情況下停止事件傳播

回答

相關問題