refactor: 优化代码:输入框处理抖动问题,网页播放修改实现方式 see #166

This commit is contained in:
涵曦 2024-09-17 01:17:38 +08:00
parent 9900bd9ee9
commit 31c61675bf
2 changed files with 12 additions and 9 deletions

View File

@ -147,12 +147,7 @@ $(function(){
$.get(`/musicinfo?name=${music_name}`, function(data, status) { $.get(`/musicinfo?name=${music_name}`, function(data, status) {
console.log(data); console.log(data);
if (data.ret == "OK") { if (data.ret == "OK") {
if (window.currentMusic) { $('audio').attr('src',data.url);
window.currentMusic.pause();
window.currentMusic.currentTime = 0;
}
window.currentMusic = new Audio(data.url);
window.currentMusic.play();
} }
}); });
}); });
@ -248,8 +243,15 @@ $(function(){
}); });
} }
// 监听输入框的输入事件 // 监听输入框的输入事件
$("#music-name").on('input', function() { function debounce(func, delay) {
let timeout;
return function(...args) {
clearTimeout(timeout);
timeout = setTimeout(() => func.apply(this, args), delay);
};
}
$("#music-name").on('input', debounce(function() {
var inputValue = $(this).val(); var inputValue = $(this).val();
// 发送Ajax请求 // 发送Ajax请求
$.ajax({ $.ajax({
@ -268,7 +270,7 @@ $(function(){
}); });
} }
}); });
}); },300));
function get_playing_music() { function get_playing_music() {
$.get(`/playingmusic?did=${did}`, function(data, status) { $.get(`/playingmusic?did=${did}`, function(data, status) {

View File

@ -74,6 +74,7 @@ var vConsole = new window.VConsole();
<button id="del_music">删除选中歌曲</button> <button id="del_music">删除选中歌曲</button>
<button id="web_play">网页播放</button> <button id="web_play">网页播放</button>
</div> </div>
<audio autoplay></audio>
</div> </div>
<hr> <hr>