涉及 e.preventDefault 的 if/else 语句

Posted 2023-04-14

【中文标题】涉及 e.preventDefault 的 if/else 语句

【英文标题】：if/else statement involving e.preventDefault

【发布时间】：2015-01-07 06:44:41

【问题描述】：

这可能是一个非常基本的问题，但我无法为我的导航栏提出 if/else 语句。我有外部页面链接和特定 ID 的组合，我想在导航栏中单击时滚动到该 ID。下面是我正在处理的代码的 sn-p，由于 e.preventDefault，我无法访问外部链接。基本上我想阻止默认的内部链接ID（而是向下滚动到该ID），并在菜单选项是外部链接时正常执行。我能得到一些帮助吗？

// if not an external link, scroll to specific ID when click on menu item
$('.webby-top-menu .navbar-nav a').click(function (e) 
    e.preventDefault();
    var linkId = $(this).attr('href');
    scrollTo(linkId);

    if ($('.navbar-toggle').is(":visible") == true) 
        $('.navbar-collapse').collapse('toggle');
    

    $(this).blur();
    return false;
);

// stick navbar on top
$('.webby-top-menu ').stickUp();

谢谢！

【问题讨论】：

为什么不给指向外部页面的链接和指向特定 ID 的链接一个不同的类名，以便为它们添加不同的事件侦听器？那么事件处理程序中只有 e.preventDefault() 用于不指向外部页面的链接？

我没有在该代码中看到您尝试执行您描述的操作。你努力了吗？

Test if links are external with jQuery / javascript? 的可能重复项（许多可能之一。）

过滤外部/内部链接似乎是 OP 的普遍问题。

@Mathletics，我没有看到关于该问题的相关解决方案。你是否？这不是内部与外部的问题，而是锚与超链接的问题。

【参考方案1】：

似乎在链接的href 属性的第一个字符处检查井号就可以了：

$('.webby-top-menu .navbar-nav a').click(function (e) 
    var link = $(this).attr('href').charAt(0);

    if (link === '#') 
        e.preventDefault();
        alert('Anchor!');
    
);

Fiddle