检测旋转木马菜单中的打开幻灯片，防止再次从顶部菜单引发单击事件。
我有一个正确工作的旋转木马菜单(当您单击一个标题时，相对幻灯片打开)。我还有一个带有元素的顶部菜单，如果单击该元素，将触发对旋转木马菜单标题的单击，使幻灯片打开，并在旋转木马菜单上直接发生单击。它可以工作，但有一个小问题：
“页面的初始状态”
如果我单击顶部菜单的元素--旋转木马菜单幻灯片--正确打开，那么如果我打开另一张幻灯片并再次单击顶部菜单，它将再次打开幻灯片。
第一次点击"Contatti“及其正确效果
问题是如果我在顶部菜单的元素上单击两次。当旋转木马菜单中的幻灯片第一次正确打开时，此时不应发生其他情况，除非用户打开新幻灯片，用户单击顶部菜单的元素以再次打开幻灯片。相反，在第二次单击顶部菜单元素时，左边的幻灯片将打开。
“第二次点击"Contatti”不应该做任何事情，相反，它打开左边的幻灯片“
我不知道为什么，我也不希望这种事发生。我在想一个解决问题的方法。在单击事件上使用计数器或设置布尔值无助于我认为，我需要准确地检测幻灯片是否打开，然后阻止对顶部菜单的单击进一步操作，但是如果用户浏览另一张幻灯片并再次单击顶部菜单，则应再次启用单击事件。
顶部菜单的HTML如下所示：
<div id='cssmenu'>
<ul>
<li class='active'><a href='index-buono.html' id="home"><span>Home</span></a></li>
<li><a href='#' id="prodotti"><span>Prodotti</span></a></li>
<li><a href='#' id="info"><span>Info</span></a></li>
<li class='last'><a href='#'id="contact" ><span>Contatti</span></a></li>
</ul>
</div>手风琴菜单的HTML如下所示：
<div class="container">
<div id="demo">
<ol>
...................
<li id="contattaci">
<h2><span>Contattaci</span></h2>
<div>
<iframe src="form.php"width="625px" height="400px" ></iframe>
</div>
p class="ap-caption">e-mail</p>
</li>
....................
</ol>
</div>
<div>这是JQuery代码，用于在用户单击顶部菜单中的元素(使用id="contact")时打开旋转木马菜单的幻灯片(使用id="contattaci")：
$( document ).ready(function() {
$(document).on('click', '#contact', function(event) {
event.preventDefault();
$("#contattaci h2").click();
});
});我建议您看看 真实页 ，以便重现问题，更好地理解问题，并尝试找到解决方案。
回答 1
Stack Overflow用户
发布于 2014-02-12 14:12:21
我在您的网站上看到，打开的幻灯片获得“选定的”类如下：
隐藏幻灯片：
<li id="contattaci" class="slide" ...>放映幻灯片：
<li id="contattaci" class="slide selected" ...>因此，您只需测试幻灯片是否已经在#contact单击中打开。您可以使用JQuery方法.hasClass()
$( document ).ready(function() {
$(document).on('click', '#contact', function(event) {
event.preventDefault();
if(!$("#contattaci").hasClass('selected')) { // if #contattaci does NOT have class .selected
$("#contattaci h2").click();
}
});
});https://stackoverflow.com/questions/21728632
复制相似问题
腾讯云开发者
