为什么jquery中的click事件不适用于我的新元素？

Question

我有三个div，分别具有左，中和右类，我想交换他们的位置，并在他们转到新位置时应用新类。 但是由于某种原因它不起作用这是我的脚本：

$(function() {
            $(".left").css("left","50px");
            $(".center").css("left","300px");
            $(".center").css("width","300px");
            $(".center").css("height","300px");
            $(".center").css("top","25px");
            $(".right").css("left","650px");
            $(".right").click(function(){
                $(".left").animate({
                    left: '650px'
                    }, 1000, function() {
                    });
                $(".center").animate({
                    left: '50px',
                    width: '200px',
                    top: '75px',
                    height: '200px'
                    }, 1000, function() {
                    });
                $(".right").animate({
                    left: '300px',
                    width: '300px',
                    height: '300px',
                    top: '25px'
                    }, 1000, function() {
                    });
                $(".bule").removeClass("left right center");
                $(".second").addClass("left");
                $(".third").addClass("center");
                $(".first").addClass("right");
                $(".bule").removeClass("first second third");
                $(".left").addClass("first");
                $(".center").addClass("second");
                $(".right").addClass("third");
                });
        });

这是一个工作示例。

Answer 1

当您使用jQuery选择器$('...')选择元素时-会对选择进行评估，并对这些元素执行以下操作。 如果以后再删除某个类或更改所选元素的ID，则说明这些操作已经执行-因此将继续执行。 同样，它们不会自动继承其他选择器的操作（因为在进行选择时它们没有该类/ ID）。

如果要绑定一次事件，并在添加新元素或更改类时使它们起作用，则需要使用稍微不同的事件语法：

$('body').on('click', '.right', function() {

});

请注意，选择器现在是body元素的原因（因为运行时body元素将始终存在）。 您在这里告诉jQuery的是将click事件绑定到<body>元素，然后，当单击<body>的子代时，请根据表达式.right评估该元素。 如果该表达式匹配，请调用我的函数。

此方法利用了javascript事件传播的优势，其中事件一直冒泡直至其最高祖先。 这意味着在div内的链接上单击将触发该链接，div和主体的单击事件-按该顺序。

为什么jquery中的click事件不适用于我的新元素？

问题描述

1 个解决方案

解决方案1
4 已采纳 2013-02-08 13:49:00

为什么jquery中的click事件不适用于我的新元素？

问题描述

1 个解决方案

解决方案1 4 已采纳 2013-02-08 13:49:00

解决方案1
4 已采纳 2013-02-08 13:49:00