javascript - jQuery单击触发两次

我有这个jsfiddle：http://jsfiddle.net/us28bg4u/1/

当我按下"First" -> "Left"时，动作只触发一次。但是，当我再次执行此操作时，该动作将触发两次，第三次按相同的动作时，它将触发三次，依此类推。

我不知道为什么它堆积。有人可以启发我吗？ :)

我尝试过：
    e.stopPropagation();
    e.preventDefault();
-但是似乎没有什么可以阻止点击次数的累积。

我的js看起来像这样：

    var side = '';
    var action = '';

    $(document).ready(function () {
        $(".first").click(function (e) {
            logit("First pressed");
            preStart('first');
        });

        $(".second").click(function (e) {
            logit('Second pressed');
            preStart('second');
        });

        function preStart(action) {
            $("#overlay").fadeIn(200);

            $(".leftside").click(function (e) {
                side = "left";
                $("#overlay").fadeOut(200);

                logit('Starting ' + action + ' (' + side + ')');
             });

            $(".rightside").click(function (e) {
                side = "right";
                $("#overlay").fadeOut(200);

                logit('Starting ' + action + ' (' + side + ')');
            });
        }

        function logit(logtxt){
            $("#log").append("<li>"+logtxt+"</li>");

        }
    });

与click（）函数在另一个函数中有关吗？

最佳答案

事件绑定可以堆叠。在preStart内部，通过在事件再次绑定之前将.unbind()添加到方法链中来清除先前的绑定，如下所示：

    function preStart(action) {
        $("#overlay").fadeIn(200);

        $(".leftside").unbind("click").click(function (e) {
            side = "left";
            $("#overlay").fadeOut(200);

            logit('Starting ' + action + ' (' + side + ')');
         });

        $(".rightside").unbind("click").click(function (e) {
            side = "right";
            $("#overlay").fadeOut(200);

            logit('Starting ' + action + ' (' + side + ')');
        });
    }

关于javascript - jQuery单击触发两次，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/25219383/