javascript - 使用类检测点击图像

Question

我有一个 jquery 脚本，它试图检查用户是否单击了具有特定类别的图像。有问题的图像如下所示:

<img src='media/voteup.png' class='upvote selected' />

我的脚本尝试使用以下代码绑定(bind)到对此图像的点击:

$(document).ready(function(){
    $(".upvote").click(function(){
        console.log("clicked");
        if ($(this).hasClass("selected")){
            // does stuff
        } else{
            // does stuff
        }
    });
});

但是，我没有收到任何控制台消息。我试过绑定(bind):

$(".upvote").on("click", ".upvote", function(){...});

但是没有成功。我想知道我是否做错了什么。

提前致谢!

编辑:

原来问题的根源是我真的很愚蠢地试图用href而不是src链接在js文件中。呃，我需要更多的 sleep :P

Answer 1

尝试使用事件委托(delegate)on()，例如:

$("body").on("click", ".upvote", function(){
    console.log("clicked");

    if ($(this).hasClass("selected")){
          // does stuff
    } else{
          // does stuff
    }
});

---

$(document).ready(function(){
  $(".upvote").click(function(){
    alert("clicked");
    if ($(this).hasClass("selected")){
      // does stuff
    } else{
      // does stuff
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src='media/voteup.png' class='upvote selected' />