Question

任何人都可以解释三个事件如何绑定到同一个函数？即，当发生以下事件时，应调用相同的函数。

窗口卸载。
按“ESC”按钮。
点击“关闭”课程。

我已经编写了以下列方式点击'.close'类的功能：

<script>
$(document).ready(function() {
    var start = new Date().getTime();
    var starttime = new Date(start);
    $(".close").click(function () {
        jwplayer('mediaplayer').stop();
        end = new Date().getTime();
        endtime = new Date(end);            
        $.ajax({ 
          url: "/courses/136",
          data: {'timeSpent': endtime - starttime},
        });
    });

  });
</script>

对于window.unload（）和按下“ESC”按钮，同样的事情应该发生。有没有任何Jquery方法。

Answer 1

创建一个负责处理事件的函数，然后你只需要将该函数传递给你想要执行它的每个事件。

<script>
  $(document).ready(function() {
    var start = new Date().getTime();
    var starttime = new Date(start);

    var eventHandler = function (event) {
        jwplayer('mediaplayer').stop();
        end = new Date().getTime();
        endtime = new Date(end);            
        $.ajax({ 
          url: "/courses/136",
          data: {'timeSpent': endtime - starttime},
        });
    };

    $(".close").click(eventHandler);
    $(window).on("unload", eventHandler);
    $(document).on("keydown", function(e) {
        if (e.which == 27) {
            eventHandler(e);
        }
    });
  });
</script>

Answer 2

您只需定义功能：

function handler() {
    jwplayer('mediaplayer').stop();
    end = new Date().getTime();
    endtime = new Date(end);            
    $.ajax({ 
      url: "/courses/136",
      data: {'timeSpent': endtime - starttime},
    });
}

...并绑定它三次;对于ESC键部分，您可能需要一个包装器：

$(".close").click(handler);
$(window).on("unload", handler);
$(document).on("keydown", function(e) { // Or whatever element is relevant
    if (e.which == 27) {
        handler.call(this, e);          // With the above, just `handler();` would work too
    }
});

Answer 3

传递给jQuery方法的函数（如.click()）不必是匿名的。您可以按名称引用功能。所以：

function yourFunction() {
   // do your jwplayer and ajax thing here
}

$(window).on("unload", yourFunction);
$(".close").click(yourFunction);
$(document).on("keyup", function(e) {
  if (e.which == 27)
    yourFunction();
});

如何在Jquery或javascript中将三个事件绑定到同一个函数？

3 个答案: