如何有条件地阻止锚点跳转到其链接页面

How to conditionally stop anchor from jump to it's link page

本文关键字：链接 有条件      更新时间：2023-09-26

我有这个问题，我想有条件地阻止锚点跳转。

条件跳转

我试图在我的coditionFun函数中添加一些代码，以有条件地阻止它跳转。

function conditionFun() { 
    var flag=false; 
    if(flag){ 
        console.log('you allowed anchor jump'); return true;
    } else {
        console.log('you stopped the anchor jump');return false;
    }
}

我希望得到"你停止了锚跳"并且不要跳到"http://www.google.com.hk"，但它记录了"你停止了锚跳"并立即跳到"http://www.google.com.hk"，有人帮我吗？谢谢！

使用jQuery将是你最好的选择。然后，只要定位点上发生单击事件，就可以运行逻辑：

<a id="anchor" href="url">Your link<a/>
$('#anchor').click(function(e){
    var flag=false; 
    if(flag){ 
        console.log('you allowed anchor jump');
    } else {
        //stops the default anchor action from running
        e.preventDefault();
        console.log('you stopped the anchor jump');
    }
})

您可以定义自己的取消默认函数。

<a id="alink" href="www.google.com">Google</a>
function cancelDefaultAction(e) {
    var evt = e ? e:window.event;
    if (evt.preventDefault) evt.preventDefault();
    evt.returnValue = false;
    return false;
}
function conditionFun(e) {
    var flag=false;
    if(flag){ 
        console.log('you allowed anchor jump');
        return cancelDefaultAction(e);
    } else {
        console.log('you stopped the anchor jump');
        return cancelDefaultAction(e);
    }
}
document.getElementById("alink").addEventListener("click", conditionFun);
相关文章：