Question

我有以下代码设置，在我的变量搜索栏上同时使用'change'和'input'事件监听器。正如你所看到的那样，它们是完全相同的，所以我想知道如何将2个事件监听器合并为一个函数？

 // Event listener for the seek bar
 seekBar.addEventListener("change", function() {
    // Calculate the new time
    var time = video.duration * (seekBar.value / 100);

    // Update the video time
    video.currentTime = time;
});

// Event listener for the seek bar
seekBar.addEventListener("input", function() {
    // Calculate the new time
    var time = video.duration * (seekBar.value / 100);

    // Update the video time
    video.currentTime = time;
});

Answer 1

将回调函数定义为命名函数，并提供引用而不是重复。

function seek() {
    var time = video.duration * (seekBar.value / 100);
    video.currentTime = time;
}

seekBar.addEventListener("change", seek);
seekBar.addEventListener("input", seek);

或者做这样的事情：

['change', 'input'].forEach(function(event){
   seekBar.addEventListener(event, seek);
});

在jQuery中，您可以使用on()方法将空格分隔为多个事件。

$(seekBar).on('input change', function() {
    var time = video.duration * (seekBar.value / 100);
    video.currentTime = time;
})

多个事件监听器？

1 个答案: