Javascript Click（）jQuery函数不适用于简单div

我试图在单击某个div时使用一个简单的

click（）

方法。我查看了许多线程，但没有找到解决方案。以下是我的jQuery代码：

var$Chart=$（'#Chart'）；
var$TopBlock=$（“#TopBlock”）；
$Chart.hover（函数（）{
//顶块
$TopBlock.hover（函数（）{
$（this.fadeTo（'fast'，1）；
$MiddleBlock.fadeTo（'fast'，.5）；
$BottomBlock.fadeTo（'fast'，.5）；
});
$TopBlock.单击（函数（）{
警报（“单击已调用的处理程序”）；
});
});

以及相关的HTML代码：

顶点

我包括了top hover函数，因为它可以自己工作。但是，当我添加click函数时，一切都中断了，包括hover函数。我尝试将单击功能移到

$TopBlock

悬停之外，但一切也都坏了。这应该是一个简单的点击功能，我真的不知道为什么这不起作用

编辑：很抱歉缺少相关资料。第一次在这里张贴海报。问题是当我单击我的

$TopBlock

div时，

click（）

函数没有启动。它应该触发一些JavaScript代码，这些代码会增加我的

#Expansion

div的维度，但我只想首先弹出警报，以确保其正常工作。

采取以下措施：

$TopBlock.click(function() {
    alert("click handler called");
});

退出

$Chart.hover…

事件。另外，将

$TopBlock.hover…

从

$Chart.hover…

事件中取出

所以你的代码应该是：

var $Chart = $('#Chart');
var $TopBlock = $('#TopBlock');

//Top Block
$TopBlock.hover(function() {
    $(this).fadeTo('fast', 1);
    $MiddleBlock.fadeTo('fast', .5);
    $BottomBlock.fadeTo('fast', .5);
});

$TopBlock.click(function() {
    alert("click handler called");
});

---

请参见

，因此我们非常希望看到您的相关（最小/）HTML。另外，分配/创建您正在使用的变量的JavaScript。此外，除了生成警报，还有什么不起作用？我们不知道您的示例中$TopBlock是什么，或者设置了什么。很抱歉，缺少相关材料@DavidThomas，我已经做了一些编辑，这些编辑应该会为您提供更多信息。在尝试单击顶部块之前，您是否确保将鼠标悬停在图表上方？将事件绑定到可能被多次触发的其他事件中通常是个坏主意。我建议将其从悬停状态中移除。除非您将鼠标悬停在图表元素上，否则您永远不会为单击创建绑定。另外，您是否确定此代码位于onload处理程序中，或者放置在图表和TopBlock元素在屏幕上呈现之后？如果没有，那么绑定也不会发生。还有

$TopBlock.hover

。您可能不希望在事件处理程序中分配事件处理程序。每当外部事件被触发时，它们将被重复添加。这是有效的！我以为我早就这么做了，但它并没有触发，但我想这次是对的。非常感谢！很高兴知道嵌套事件处理程序不是最好的主意。@user3108571不客气！您将在此网站上学到很多；-）