Question

我正在我的个人网站上工作（从模板构建），就在我完成时，我的链接停止响应左键单击。如果您右键单击并选择“在新标签页中打开”，＆＃39;他们工作得很好。将鼠标悬停在它们上方时，您可以在浏览器底部的状态栏中看到该网址。

我已经对此进行了相当多的搜索，似乎可能有一些JavaScript会覆盖标记的默认行为。我曾尝试查看Chrome和Firefox DevTools的Network和EventListener部分，但我并不完全确定我在寻找什么。

我不想在这里粘贴整个网站的代码（太长时间），但您可以download it from my Github page亲自尝试一下。

由于我认为问题与JavaScript有关，因此以下是我网站的页眉和页脚部分，因此您可以看到我附加的内容：

<head lang="en">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

<title>Mike Lipson | Instructional Technology Specialist</title> 

<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<link rel="stylesheet" href="fancybox/jquery.fancybox-v=2.1.5.css" type="text/css" media="screen">
<link rel="stylesheet" href="css/font-awesome.min.css" rel="stylesheet">

<link rel="stylesheet" type="text/css" href="css/style.css">    

<link href='http://fonts.googleapis.com/css?family=Titillium+Web:400,600,300,200&subset=latin,latin-ext' rel='stylesheet' type='text/css'>


<link rel="prefetch" href="images/zoom.png">

<style type="text/css" media="screen">
    a.heading_link {
        color: white;
    }
</style>

    <!-- SCRIPTS -->
<script src="js/html5shiv.js"></script>
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/jquery-migrate-1.2.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.easing.1.3.js"></script> <!-- Potential link-breaker -->
<script type="text/javascript" src="fancybox/jquery.fancybox.pack-v=2.1.5.js"></script>
<script src="js/script.js"></script>

<!-- fancybox init -->
<script>
$(document).ready(function(e) {
    var lis = $('.nav > li');
    menu_focus( lis[0], 1 );

    $(".fancybox").fancybox({
        padding: 10,
        helpers: {
            overlay: {
                locked: false
            }
        }
    });

});
</script>

Answer 1

carousel API会自动捕获[data-slide]或[data-slide-to]元素（拥有data-slide或data-slide-to参数的标记）的任何点击。

您在其中一个主要容器上设置了<div data-slide="1">属性（请参阅index.html#L68），因此将捕获并阻止任何点击（e.preventDefault()）。

您可以在carousel插件定义js/carousel.js#L187中看到。

因此，您应该删除此属性并使用其他属性名称，或停用carousel API。

左键单击链接不起作用，但“在新标签中打开”可以

1 个答案: