Javascript 赢得外部链接';t打开

Javascript 赢得外部链接';t打开,javascript,html,Javascript,Html,我是一个有JS的noob,我有一个单页网站的菜单栏,可以滚动页面,但不会打开外部链接,你们中的一个可以帮助我吗?代码如下,可在以下网址查看该网站: html 您已将阻止默认值附加到锚事件。这会阻止链接工作 $(".navbar a,a.btn-appoint, .quick-info li a, .overlay-detail a").on('click', function(event) { event.preventDefault(); // prevents link fr

我是一个有JS的noob,我有一个单页网站的菜单栏,可以滚动页面,但不会打开外部链接,你们中的一个可以帮助我吗?代码如下,可在以下网址查看该网站:

html


您已将阻止默认值附加到锚事件。这会阻止链接工作

$(".navbar a,a.btn-appoint, .quick-info li a, .overlay-detail a").on('click', function(event) {
        event.preventDefault(); // prevents link from working. Remove it and you should be good.

尝试向所有带有锚的链接(前4个)添加一个特殊类,只需单击这些链接即可调用该函数,通过单击

保持标准行为我修改了js和html代码:(我猜此代码是Medilab+模板的一部分) JS/JQuery

(function ($) {

// Add smooth scrolling to all links in navbar
$(".navbar2").on('click', function(event) {
    event.preventDefault();
    var hash = this.hash;
    $('html, body').animate({
        scrollTop: $(hash).offset().top
    }, 900, function(){
        window.location.hash = hash;
    });
});

//jQuery to collapse the navbar on scroll
$(window).scroll(function() {
    if ($(".navbar-default").offset().top > 50) {
        $(".navbar-fixed-top").addClass("top-nav-collapse");
    } else {
        $(".navbar-fixed-top").removeClass("top-nav-collapse");
    }
});})(jQuery);
HTML代码:

<div class="collapse navbar-collapse navbar-right" id="myNavbar">
  <ul class="nav navbar-nav">
    <li class="active"><a href="#home" class="navbar2" style="padding:0px 10px 0px 10px;">Home</a></li>
    <li class=""><a href="service.html#service" style="padding:0px 10px 0px 10px;">Services</a></li>
    <li class=""><a href="#about" class="navbar2" style="padding:0px 10px 0px 10px;">About</a></li>
    <li class=""><a href="contact.html#contact" style="padding:0px 10px 0px 10px;">Contact</a></li>
  </ul>
</div>


event.preventDefault()
禁用锚点的默认功能,这样它们就不会指向其
href
目的地。您的
是如何在页面上定义的<代码>确切的问题是什么?你想让他们打开一个外部链接还是什么?嗯…我测试了你的代码,没有发现任何问题。除非你真的忘了给每个分区加个ID。
(function ($) {

// Add smooth scrolling to all links in navbar
$(".navbar2").on('click', function(event) {
    event.preventDefault();
    var hash = this.hash;
    $('html, body').animate({
        scrollTop: $(hash).offset().top
    }, 900, function(){
        window.location.hash = hash;
    });
});

//jQuery to collapse the navbar on scroll
$(window).scroll(function() {
    if ($(".navbar-default").offset().top > 50) {
        $(".navbar-fixed-top").addClass("top-nav-collapse");
    } else {
        $(".navbar-fixed-top").removeClass("top-nav-collapse");
    }
});})(jQuery);
<div class="collapse navbar-collapse navbar-right" id="myNavbar">
  <ul class="nav navbar-nav">
    <li class="active"><a href="#home" class="navbar2" style="padding:0px 10px 0px 10px;">Home</a></li>
    <li class=""><a href="service.html#service" style="padding:0px 10px 0px 10px;">Services</a></li>
    <li class=""><a href="#about" class="navbar2" style="padding:0px 10px 0px 10px;">About</a></li>
    <li class=""><a href="contact.html#contact" style="padding:0px 10px 0px 10px;">Contact</a></li>
  </ul>
</div>