如何防止在单击代码中的链接时,此链接会将我带到引用的页面

How do I prevent that when the link in the code is clicked this link takes me to the page that makes reference

本文关键字:链接 引用 单击 何防止 代码      更新时间:2023-09-26

我找到了这段代码

<body>
<div id="div1">
What is 2+2?
</div>
<div id="div2">
<a href="answerswer.html" id="answerswer_link">Get the answer</a>
</div>
</body>

然后是JavaScript

var d1 = document.getElementById("div1");
var a_link = document.getElementById("answerswer_link");
a_link.onclick = function() 
{
   d1.innerHTML = "That is easy, the answer is <strong>4</strong>!";
   return false;
};

所以这段代码有效,因为它改变了div1 中的内部 HTML并且不加载链接引用的页面,但如果我想使用事件侦听器怎么办?我写这个

a_link.addEventListener( 'click', function(){
    d1.innerHTML = "That is easy, the answer is <strong>4</strong>!";
    return false;
}, false);

但它不会阻止链接加载引用 我如何使用与上面一小段代码相同的事件侦听器?

对普通浏览器使用 e.preventDefault(),在较旧的 IE 浏览器中使用 event.returnValue

aLink.addEventListener( 'click', function(e){
    d1.innerHTML = "That is easy, the answer is <strong>4</strong>!";
    if (e && e.preventDefault) {
        e.preventDefault();
    } else {
        window.event.returnValue = false;   // guess who - IE
    }
}, false);

实际上,旧版本的IE甚至不支持addEventListener(),因此仅当您与attachEvent()使用相同的回调函数时,才需要代码的IE部分addEventListener()就像我一样。

你试过prevenDefault吗? 这可能有助于您控制点击事件的功能。

此处的文档 - https://developer.mozilla.org/en/DOM/event.preventDefault

此外,在您的代码中。 您可以从引用名为 a_link 的 var 和名为 aLink 的 var 来引用 <a> 标记。 这是拼写错误还是只是实现中的更改?

如果您不打算加载锚点,为什么还需要 URL?你不能只使用"#"或其他东西吗?