如何禁用html链接而不是调用JS函数？

  • Z时代
  • 2024-01-10
  • 分类：问答

为了让我的文本与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>

回答：

因为链接是动态创建的，你应该使用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

以上是 如何禁用html链接而不是调用JS函数？ 的全部内容， 来源链接： utcz.com/qa/257742.html

回到顶部