javascript 如何使用 CSS 或 jquery 使链接不可点击?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/20728292/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 19:08:31  来源:igfitidea点击:

How to make link unclickable using CSS or jquery?

javascriptjqueryhtmlcss

提问by Frank Martin

I have the following HTML.

我有以下 HTML。

<ul class="static">
    <li class="static dynamic-children">
        <a class="static dynamic-children menu-item" href="test.php" tabindex="0">
            <span class="additional-background">
                <span class="menu-item-text">Link</span>
            </span>
        </a>
        <ul class="dynamic">
        </ul>
     </li>
</ul>

As you can see when I click on "Link" then it takes me to "test.php" page. I want this "Link" to be unclickable like you place "#" for e.g. href="#"

正如您所看到的,当我单击“链接”时,它会将我带到“test.php”页面。我希望这个“链接”是不可点击的,就像你为例如 href="#" 放置“#”一样

Is it possible to do this using CSS or Jquery? Can't use Javascript's document.getElementByIdbecause there is no ID defined for this element.

是否可以使用 CSS 或 Jquery 来做到这一点?无法使用 Javascript 的document.getElementById,因为没有为此元素定义 ID。

采纳答案by Sergio

Different options:

不同的选择:

$('a[href="test.php"]').click(function(){
    return false;
});

or

或者

$("static dynamic-children a.menu-item").click(function(){
    return false;
});

You can also use event.preventDefault()which prevents the default/expected behaviour of a link. Use like:

您还可以使用event.preventDefault()来防止链接的默认/预期行为。像这样使用:

$("static dynamic-children a.menu-item").click(function(event){
    event.preventDefault();
});

回答by dcodesmith

You can cancel the link behavior by firing preventDefault()on the click of this link:

您可以通过preventDefault()单击此链接触发来取消链接行为:

$("a.menu-item").click(function(evt){
    evt.preventDefault();
});

回答by Hiral

Write return false

return false

$("a.menu-item").click(function(){
    return false;
});

OR

或者

e.preventDefault()

e.preventDefault()

$("a.menu-item").click(function(e){
    e.preventDefault();
});