我有一个我正在处理的简单代码
今天我发现了一些奇异的东西。
相同的代码
<a href="tel:+393481234567">348-1234567</a>
在该页面中粘贴了三次 - 它被粘贴在一个可见的div中，在那里工作并点击链接，呼叫开始，
你对此有任何疑问吗？
要检查它的实际效果，请使用智能手机查看此测试页 http://hc.no-ip.biz/nav/tel-doesnt-work.html
这个数字可以在顶部橙色栏下面的loremipsum文本中找到，它可以（调用发生），而如果你点击汉堡按钮取消隐藏导航菜单，你会再次发现同一个电话链接两次， 或者作为li项目作为导航菜单最底部的链接。
如果您检查该网页来源，您会看到该链接已被复制并粘贴，没有任何差异。
编辑01： 正如弗洛里安所说，我改变了结构 使用菜单按钮向div添加了id =“hamburger” 将javascript更改为
$('#hamburger').on('click',function(){
但行为相同： - （
编辑02： 解决了，谢谢Florianb的有趣链接。当叠加层被隐藏时，另外两个“点击”事件（它们是可选的）正在拦截点击事件。我删除了它们，现在它正常工作。
编辑03： 为方便大家，在这里你找到问题的页面代码，在底部包含两个事件的代码，删除。
<header class="fissotop">
<div id="responsive-logos">
<div id="responsive-logo1" class="logo"><a href="#">
<img class="btn-open" src="recupero-euro-logo.png" alt="">
<img class="btn-close" src="recupero-euro-logo.png" alt=""></a></div>
<div id="responsive-logo2" class="logo"><a href="#">
<img class="btn-open" src="recupero-euro-logo-32.png" alt="">
<img class="btn-close" src="recupero-euro-logo-32.png" alt=""></a></div>
</div>
<div id="navigation-brief">
<nav>
<ul>
<li><a href="#">RecuperoEuro</a></li>
<li><a href="#">Chiavette</a></li>
<li><a href="#">Schede</a></li>
<li><a href="#">SSD</a></li>
<li><a href="#">Contatti</a></li>
</ul>
<div class="button" id="hamburger">
<img class="btn-open" src="hamburger-button-32-w.png" alt="">
<img class="btn-close" src="close-button-32-w.png" alt=""></div>
</nav>
</div>
</header>
<div class="navigation-full">
<div class="wrap">
<nav>
<ul class="wrap-nav">
<li><a href="#">Recupero Euro</a>
<ul>
<li><a href="#">About</a></li>
<li><a href="#">Processo</a></li>
<li><a href="#">Condizioni</a></li>
<li><a href="#">Dove siamo</a></li>
</ul>
</li>
<li><a href="#">Chiavette</a>
<ul>
<li><a href="#">Kingston</a></li>
<li><a href="#">Sandisk</a></li>
<li><a href="#">Verbatim</a></li>
<li><a href="#">Transcend</a></li>
<li><a href="#">Lexar</a></li>
<li><a href="#">Altre</a></li>
</ul>
</li>
<li><a href="#">SSD e Schede</a>
<ul>
<li><a href="#">SSD Solid State Drive</a></li>
<li><a href="#">Compact Flash CF</a></li>
<li><a href="#">SD</a></li>
<li><a href="#">MicroSD</a></li>
<li><a href="#">Monolitiche</a></li>
</ul>
</li>
<li><a href="#">Contatti</a>
<ul>
<li><a href="http://tickets/newticket.php?department=4">Creare un ticket</a></li>
<li><a href="tel:+393481234567">348-1234567</a></li>
<li>info{at]mail.it</li>
</ul>
</li>
</ul>
</nav>
<div class="social">
<a href="tel:+393481234567">348-1234567</a> lorem ipsum
face-boken twittagain
</div>
</div>
</div>
<div class="marginetop">
<a href="tel:+393481234567">348-1234567</a> Longnose lancetfish, goldfish clingfish Mex
ican golden trout bluntnose minnow; lorem ipsum lorem ipsum
</div>
<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
<script>
$(document).ready(function(){
$('.btn-close').fadeOut(200);
var open = false;
$('#hamburger').on('click',function(){
if(open == false){
$('.navigation-full, .btn-close').fadeIn(200);
$('#navigation-brief ul li, .btn-open').fadeOut(200);
open = true;
} else {
$('.navigation-full, .btn-close').fadeOut(200)
$('#navigation-brief ul li, .btn-open').fadeIn(200);
open = false;
}
});
$('.navigation-full').on('click', function(){
$('.navigation-full, .btn-close').fadeOut(200);
$('#navigation-brief ul li, .btn-open').fadeIn(200);
open = false;
});
$('.wrap').on('click', function(){
return false;
});
})
</script>
在弗洛里安的建议之后，我已经删除了javascript中的最后两个选择器，因为他们在感兴趣的区域覆盖了一个太宽的页面问题，正如暗示的那样，他们正在拦截点击动作，所以以下代码已被删除
$('.navigation-full').on('click', function(){
$('.navigation-full, .btn-close').fadeOut(200);
$('#navigation-brief ul li, .btn-open').fadeIn(200);
open = false;
});
$('.wrap').on('click', function(){
return false;
});
答案 0 :(得分：1)
您在脚本中注册了一个on-click-handler，如下所示：
$('.button a').on('click',function(){...
jQuery采用CSS-selectors作为工具来定义受影响的DOM元素。
让我们看看你选择了什么：
.button a
你的表达有两条规则。
.button - 标识符与类型按钮的每个类相匹配，a - 标识符与每个元素匹配类型锚。.button a，您可以告诉jQuery匹配.button元素由a - 元素后代的每个DOM结构。因此，主页上的a - 元素错过了星座，而它没有匹配且没有附加点击处理程序。
P.s。：这篇非常好的帖子The 30 CSS Selectors you Must Memorize我帮助你熟悉css-selectors。