如何禁用html鏈接而不是調用JS函數？

爲了讓我的文本與dbpedia有鏈接，我想知道Javascript中是否存在一種有效的方法，通過單擊鏈接顯示帶有選定dbpedia信息的div，而不是鏈接到頁面上？我正在尋找某種「顯示無」的鏈接，以允許我顯示我的div。我找不到這個方法，它存在嗎？如何禁用html鏈接而不是調用JS函數？

此外，由於Ajax請求，我的文本中的鏈接是動態生成的，並且它們沒有id或class。

這是我在我的文字鏈接之一：

<a href="http://dbpedia.org/resource/Lorem_ipsum" title="http://dbpedia.org/resource/Lorem_ipsum" target="_blank" on>Lorem Ipsum</a>

來源

2017-12-02 Paul

因此，如果生成的鏈接動態取之於阻止你添加一個類或事件偵聽器？這將使事情變得更容易，以確保您的功能只會觸發預期的定位標記 – NewToJS

根據您創建動態定位標記的方式，您還可以添加像這樣的偶數聽衆/調用。我添加了兩個方法，因爲有些人將元素作爲字符串編寫而不是使用'.createElement（）'[** JsFiddle Example **]（https://jsfiddle.net/dzst74cs/） – NewToJS

因爲鏈接是動態創建的，你應該使用event delegation得到它們。您可以使用attribute selector來查看僅以特定子字符串開頭的鏈接。然後使用preventDefault在使用AJAX獲取信息並將其添加到模式之前禁用鏈接。

$(document).on('click', 'a[href^="http://dbpedia.org"]', function (e) { 
    e.preventDefault(); 
    // load data from your source 

});

DEMO

非jQuery的版本將是這個樣子：

document.addEventListener('click', handleClick, false); 

function handleClick(e) { 
    const el = e.target; 
    if (el.tagName === 'A' && el.href.startsWith('http://dbpedia.org')) { 
    e.preventDefault(); 
    // Do things 
    } 
}

DEMO

來源

2017-12-02 18:53:25 Andy

如何禁用html鏈接而不是調用JS函數？

回答

相關問題