Question

说我有一个链接：

<a href="http://www.example.com">Example!</a>

我想保持链接完整，但我想要一个onclick事件来判断该链接是否可点击

<a onclick='stopLight()' href="http://www.example.com">Example!</a>

function stopLight() {

    // conditional logic
    // return true or return false
}

所以如果stopLight（）== true，那么链接工作，如果stopLight（）== false，则链接不起作用。在不改变href的情况下实现这一点，因为我宁愿不

Answer 1

对return stopLight()处理程序使用onclick _{正如mplungjan在他的comment}

中所建议的那样

Answer 2

为了削减默认操作：

stopLight = function (e) {
    window.event.preventDefault();
}

这可以防止事件发生。

所以你可以这样做：

<a onclick='isStopLight()' href="http://www.example.com">Example!</a>

在JS中

isStopLight= function(){
   if(stopLight()){
      window.event.preventDefault();
   } 
}

stopLight = function () {
    // conditional logic
    // return true or return false
}

干杯。

Answer 3

您可以使用jQuery和event.preventDefault（）方法执行此操作：

$('a.yourLink').on('click',function(e){
  if (stopLight()){ 
    e.preventDefault();
  }
});

如果stopLight为true，将阻止<a>的默认行为，否则执行正常

Answer 4

普通JS

内联

<a onclick='return stopLight()' href="http://www.example.com">Example!</a>

不显眼：

window.onload=function() {
  document.getElementById("stoplight").onclick=function() {
    // conditional logic
    // return true or return false
  }
}

<a id="stoplight" href="http://www.example.com">Example!</a>

的jQuery

<a id="stoplight" href="http://www.example.com">Example!</a>

$(function() {
  $("#stoplight").on("click",function(e) {
    // conditional logic
    if (false condition) e.preventDefault(); // (or return false;) 
  });
});

如何在不更改href的情况下阻止html链接？

4 个答案: