页面滚动音效需手动交互后才能播放的问题求助

我现在碰到一个棘手的问题：想给页面添加鼠标滚轮滚动时的音效，但页面加载完成后直接滚动的话，监听事件明明生效了，可声音就是播不出来。只有当我先和页面做一次交互（比如随便点击一下页面）之后，再滚动才能听到滚动音效。

我试过在JS脚本里先把音量调到0播放一次再恢复正常音量，没用；甚至手动加了document.click()在脚本开头，也没能解决问题。

下面是我的JS代码：

click.preload = 'auto';

var sc = new Audio("/SND/scroll.wav");
sc.preload = 'auto';

// 尝试自动播放一次音效
sc.volume = 0.0;
sc.play();
sc.volume = 1.0;
sc.pause();
sc.currentTime = 0;

function playClick(evt){
    if(evt.target.nodeName == "input" ||
       evt.target.id == "arrw_l" ||
       evt.target.id == "arrw_r"
    ){
        click.currentTime = 0; click.play();
    }
}

function playScroll(evt){
    sc.currentTime = 0; sc.play();
}

window.onload = function(){
    document.addEventListener('wheel', playScroll);
    document.addEventListener('click', playClick);
}

备注：内容来源于stack exchange，提问作者Mattia Antonacci