请教一个简单的JQuery问题

Question

<script src="https://cdn.bootcss.com/jquery/3.3.0/jquery.js"></script>
<div class="t1">
    <p>test</p>
</div>
<script>
    $(".t1").click(function () {
        //$(".t1").attr('class', 't2');
        $(".t1").removeClass("t1").addClass("t3");
        // console.log(this.attr('class'));
        console.log("also can click");
    });
</script>

为什么已经改变了元素的 classname ，但是依然能 click ？

Answer 1

事件是绑定在了那个div上了，你改变它的class，div还是那个div呀

Answer 2

$(".t1")这个东西的参数叫做选择器，返回值是符合的DOM。
然后呢，在DOM上添加了click事件。

添加完了之后你再去改class也没用。因为事件是之前绑上去的。就和你再新增一个叫.t1的DOM也不会有这个click事件了。

当然，jquery有事件委托的写法。是通过把事件绑在父级，然后通过e.target来判断触发元素的。是动态的

Answer 3

 $("body").on("click",".t1",function () {
        $(".t1").removeClass("t1").addClass("t3");
        console.log("also can click");
    });

→_→改成这样就不能了，正如上面有人说的

Answer 4

demo
类名只是让你找到要绑定的DOM节点，事件是绑定在这个节点上，而不是绑在类上。所以你删除类是没有用的，就像你的代码或是我demo中的按钮1。而想要实现只点一次的情况，需要使用removeEventListener方法。

Answer 5

事件已经绑定了，不是像想的那样换了类名事件就解绑了

Answer 6

解绑
http://api.jquery.com/off/

Answer 7

这个应该用 toggle