How can I disable HREF if onclick is executed?

I have an anchor with both HREF and ONCLICK attributes set. If clicked and Javascript is enabled, I want it to only execute ONCLICK and ignore HREF. Likewise, if Javascript is disabled or unsupported, I want it to follow the HREF URL and ignore ONCLICK. Below is an example of what I'm doing, which would execute the JS and follow the link concurrently (usually the JS is executed and then the page changes):

<A HREF="http://example.com/no-js-login" ONCLICK="yes_js_login()">Log in</A>

what's the best way to do this?

I'm hoping for a Javascript answer, but I'll accept any method as long as it works, especially if this can be done with PHP. I've read "a href link executes and redirects page before javascript onclick function is able to finish" already, but it only delays HREF, but doesn't completely disable it. I'm also looking for something much simpler.

274408 次浏览
小开 
    yes_js_login = function() {
// Your code here
return false;
}

如果返回 false，则应该阻止默认操作(转到 href)。

编辑: 对不起，这似乎不起作用，你可以做以下代替:

<a href="http://example.com/no-js-login" onclick="yes_js_login(); return false;">Link</a>
小开

这个可能会有帮助。 不需要 JQuery

<a href="../some-relative-link/file"
onclick="this.href = 'https://docs.google.com/viewer?url='+this.href; this.onclick = '';"
target="_blank">

此代码执行以下操作: 将相关链接传递到 < a href = “ https://Docs.Google.com/view”rel = “ nofollow”> Google Docs Viewer

  1. 通过 this.href获得锚的完整链接版本
  2. 打开新窗口的链接。

所以在你的情况下，这可能会奏效:

<a href="../some-relative-link/file"
onclick="this.href = 'javascript:'+console.log('something has stopped the link'); "
target="_blank">
小开
最佳答案

如果在 onclick属性中将 return 放在第一位，则可以使用第一个未经编辑的解决方案:

<a href="https://example.com/no-js-login" onclick="return yes_js_login();">Log in</a>


yes_js_login = function() {
// Your code here
return false;
}

例子: https://jsfiddle.net/FXkgV/289/

小开

我解决了这样一个问题: 我需要一个元素模板来处理常规 URL 或 javascript 调用，js 函数需要一个对调用元素的引用。在 javascript 中，“ this”只在表单元素的上下文中作为自引用，例如按钮。我不想要一个按钮，只是一个普通链接的外观。

例子:

<a onclick="http://blahblah" href="http://blahblah" target="_blank">A regular link</a>
<a onclick="javascript:myFunc($(this));return false" href="javascript:myFunc($(this));"  target="_blank">javascript with self reference</a>

The href and onClick attributes have the same values, exept I append "return false" on onClick when it's a javascript call. Having "return false" in the called function did not work.

小开

如果您传递这样的事件参数，就会更简单:

<a href="#" onclick="yes_js_login(event);">link</a>

function yes_js_login(e) {
e.stopImmediatePropagation();
}
小开 
<a href="http://www.google.com" class="ignore-click">Test</a>

使用 jQuery:

<script>
$(".ignore-click").click(function(){
return false;
})
</script>

with JavaScript

<script>
for (var i = 0; i < document.getElementsByClassName("ignore-click").length; i++) {
document.getElementsByClassName("ignore-click")[i].addEventListener('click', function (event) {
event.preventDefault();
return false;
});
}
</script>

将类 .ignore-click分配给您喜欢的任意数量的元素，并单击这些元素将被忽略

小开

您可以使用以下简单代码:

<a href="" onclick="return false;">add new action</a><br>
小开

只需使用 preventDefault禁用默认浏览器行为，并在 HTML 中传递 event。

<a href=/foo onclick= yes_js_login(event)>Lorem ipsum</a>

yes_js_login = function(e) {
e.preventDefault();
}
小开

在我的例子中，当用户单击“ a”元素时，我有一个条件，条件是:

如果其他部分有超过10个项，那么用户不应该被重定向到其他页面。

如果其他部分的项少于10个，那么用户应该被重定向到其他页面。

“ a”元素的功能取决于其他组件:

var elementsOtherSection = document.querySelectorAll("#vehicle-item").length;
if (elementsOtherSection> 10){
return true;
}else{
event.preventDefault();
return false;
}
小开

尝试按以下方式使用 javascript:void(0)

<a href="javascript:void(0)" onclick="...">Text</a>


提交答案