Javascript 切换不适用于show适用的同一元素

我尝试使用JQuery切换，因此当用户单击信息图标时，包含项目信息的隐藏div将显示/隐藏。出于某种原因，它对我不起作用

在尝试调试时，我注意到show（）正确地显示了我想要切换的目标元素。但是，当我将

show（）

替换为

toggle（）

时，它不起作用，也不会返回任何错误

我想知道是否有人能帮我找出这个问题的原因

我的标记

<div class="option">    
    <div class="prod-text">Toy Whistle </div>
    <div>
        <img class="info-icon" src="Info-icon.png">
    </div>
    <div class="option-info" style="display:none;">
        <div>
            <div class="price-text">Price: $100</div>
            <div class="prod-id-text">Item Number: 231912</div>
            <div class="quantity-text">Quantity: 72</div>
        </div>
    </div>
</div>

JQuery（工作！）

---

非常感谢

单击事件处理程序可能会绑定两次，因此每次单击都会触发两次。在这种情况下，

show（）

可以正常工作，但是每次单击时，

toggle（）

都会显示并立即隐藏元素。试试这个：

$(".info-icon").click(function(){
    console.log('click handler fired');
    $(this).parent().parent().find('.option-info').toggle();
});

---

并在启用Web Inspector或Firebug的情况下运行此操作，以查看每次单击记录的消息数。

对我来说似乎很好：。你能提供更多信息或一个可运行的例子吗？它在这里起作用：@esker，谢谢你的回复。我试过了，但是代码太多了：/关于如何开始调试这样的问题，有什么建议吗？上面的代码是在AJAX调用之后生成的。因此，这里涉及到AJAX、JavaScript和大量标记（总共1000多行），否则我会发布它…如何解释

show（）

工作和

toggle（）

不在同一个选定元素上工作？这是一个如此奇怪的问题，我甚至不知道如何修复它：（在您看到错误的应用程序中，

.find（）

是否每次都返回相同的预期元素集？这是我要调查的一件事。我还将调查元素的初始状态。可能是您第一次调用

.toggle（））

执行相反的转换。+1，非常感谢@esker的帮助！我最终使用您的

控制台解决了问题。日志
建议，这是一个多么棒的调试工具，以前从未使用过！我很感激：）问题是由于在悬停事件侦听器中有
信息图标
单击事件侦听器，它导致它无缘无故地多次开火。现在它每次点击只发射一次。
$(".info-icon").click(function(){
    $(this).parent().parent().find('.option-info').show();
});

$(".info-icon").click(function(){
    console.log('click handler fired');
    $(this).parent().parent().find('.option-info').toggle();
});