Question

这令人沮丧！我无法让我的点击事件处理程序工作。我花了好几个小时试图弄清楚问题是什么，但失败了。

以下是我的模板代码：

<template name="ViewStats">
<div class="tileMenu" > </div>
</template>

tileMenu有一个嵌入式图像，大到可以点击。我甚至尝试用更大的图像替换嵌入的图像，希望增加可点击区域，但似乎没有任何区别。

以下是我的css：

.tileMenu{
    position: absolute;
    left: 115px;
    z-index: 2;
    height: 49px;
    background: url(images/tileMenu.png) no-repeat;
    top: 1px;
    display: block;
    height: 24px;
    margin-left: 1PX;
    margin-top: 2px;
    float: left;
    width: 17px;
    background-repeat: no-repeat;
    background-position: right 4px top 3px;
    background-size: 75% 75%;
}

现在对于没有启动的事件处理程序。我做错了什么？

Template.ViewStats.events({

     'click .tileMenu': function (event) {

      alert("You clicked tileMenu"); 
        }   
 });

有人可以解释为什么我的警报功能无法启动吗？

提前致谢！

Answer 1

您的模板事件代码很好，它应该正常工作。

因此，我认为您的实际活动未发生的原因是您的点击未在您定位的div上注册。

这可能是因为div被奇怪地定位在另一个div之下。尝试删除所有样式并单击div。另外，请尝试检查元素以查看页面上实际tileMenu div的位置。

暂时将div中的一些内容作为可视化测试。所以你知道你在哪里点击是div。例如：

<div class="tileMenu" > CLICK ME CLICK ME CLICK ME </div>

我怀疑一旦你删除了样式或找到div的位置并点击它就会看到你的警报火。

Answer 2

A div with no content is 'hard to click'. Put some content in there so you can make sure you're really clicking on the div. Try adding text and testing. Alternatively try putting the image in actual HTML instead of background

为什么我的点击事件处理程序不起作用？

2 个答案: