我想为视频的每个用户存储默认音量(通过将 ajax 发布到服务器然后将其存储到数据库中)，我这样写:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<video id="video" src="http://www.sample-videos.com/video/mp4/240/big_buck_bunny_240p_2mb.mp4" controls></video>
<script>
document.getElementById('video').addEventListener('volumechange', function () {
console.log('change')
//post a request to server to set default volume by ajax
})
</script>
</body>
</html>但我发现当用户通过拖动改变音量时，它会触发几十个请求(通过控制台中的change日志检查)...它很脏(和资源consuming) 向服务器发送几十个 ajax，唯一有用的 ajax 是由最后一个 volumechange 事件触发的。
我的问题:
- 是否可以仅在最后一个
volumechange事件时才发送 ajax？如果可能，那么如何实现？ - 如果问题 1 不可能解决或需要大量工作，如何解决(发布几个(不是几十个)ajax 是可以接受的)？
最佳答案
您需要使用“去抖动”。这与自动完成或预输入文本框中使用的技术相同。有很多实现和库可以执行此操作。
为了解释去抖动，您设置了一个超时并在每次事件触发时重置它。如果自上次事件以来经过了足够的时间，则触发该行为。
我复制的例子来自https://davidwalsh.name/function-debounce
// Create the listener function
var updateLayout = _.debounce(function(e) {
// Does all the layout updating here
}, 500); // Maximum run of once per 500 milliseconds
// Add the event listener
window.addEventListener("resize", updateLayout, false);
您会注意到该示例使用了 _。这是因为这也是一个 function in the underscore library .
关于javascript - 如何检查一个事件是最后一个事件？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39684544/