超鏈接節點的所有子元素是否也鏈接？

基本上，我有一個大的超鏈接元素，與背景圖像。當用戶將鼠標懸停在它上面時，我爲他們公開了一個編輯按鈕，單擊該按鈕彈出一個輸入窗體，供他們編輯有關超鏈接的某些內容。超鏈接節點的所有子元素是否也鏈接？

例如，拍攝相冊。我會將他們的封面照片和他們的名字顯示在用戶的所有相冊中。點擊相冊後，用戶將被重新定位到擁有該相冊內容的其他頁面。但是，當他們將鼠標懸停在照片上時，會在專輯的右下角顯示一個編輯按鈕。當他們點擊這個按鈕時，就會顯示一個編輯表單讓他們編輯相冊的標題。

但是，當他們點擊暴露的編輯按鈕時，也會激活鏈接，並將其轉移到該相冊的內容中。它確實暴露了編輯表單，但它並不重要，因爲頁面會自動將它們傳輸到不同的視圖。

我該如何解決這個問題？超鏈接節點的所有子節點是否也超鏈接？如果是這樣，我怎麼能禁用只有一個編輯按鈕的超鏈接機制？

來源

2013-03-12 Nate L

我們不是預言者。向我們展示一些代碼。 – xyz 2013-03-12 06:27:38

顯示您的代碼。必要時使用[jsfiddle]（http://jsfiddle.net）模擬您的問題。 – soundswaste 2013-03-12 06:28:20

你必須'e.preventDefault（）'。 – 2013-03-12 06:28:50

查看關於https://developer.mozilla.org/en-US/docs/DOM/event.stopPropagation和http://api.jquery.com/event.stopPropagation/的文檔。

$(elementThatOpensTheEditBox).click(function(e){ 
    e.preventDefault(); 
    e.stopPropagation(); 

    // whatever code here to open the edit box 
});

如果元素是動態生成的，可以使用.on單擊事件綁定：

$('body').on('click', elementThatOpensTheEditBox, function(e){ 
    e.preventDefault(); 
    e.stopPropagation(); 

    // whatever code here to open the edit box 
});

來源

2013-03-12 06:32:10

嗯，這似乎是因爲我從AJAX函數生成我的DOM樹。我猜想當我創建該監聽器時，它只適用於已存在的節點？ – 2013-03-12 07:40:29

是的，我試圖做一個沒有監聽器的stopPropagation，而是從一個單獨的函數中調用onclick。我明天要解決這個問題。 – 2013-03-12 07:49:24

@NateL查看我的動態生成元素的更新代碼。 – 2013-03-12 19:18:41

jQuery的使用事件代表團（$.on()）：

<a href="http://www.yahoo.com/" id="outer"> 
    <p>Click in the blue to follow the link</p> 
    <p id="inner">I am inner to the link</p> 
</a> 

var $outer = $('#outer'); 

$outer.on('click', '#inner', function prevent(e){ 
    console.log('Inner clicked.'); 
    e.preventDefault(); 
});

http://jsfiddle.net/userdude/fYPnu/2

和平凡的Javascript：

var inner = document.getElementById('inner'); 

inner.addEventListener('click', function prevent(e){ 
    console.log('Inner clicked.'); 
    e.preventDefault(); 
});

http://jsfiddle.net/userdude/fYPnu/1

注意，對於IE8 <向後兼容，你需要以檢測.attachEvent()爲好。

來源

2013-03-12 06:36:09

明天我會試試這個。萬分感謝。我似乎總是有jQuery選擇器的問題。他們似乎相當有錢。 – 2013-03-12 07:34:49

超鏈接節點的所有子元素是否也鏈接？

回答

相關問題