首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >无法在jquery函数之外获取变量的值

无法在jquery函数之外获取变量的值
EN

Stack Overflow用户
提问于 2019-07-17 16:10:33
回答 1查看 77关注 0票数 0

我正在尝试制作一个具有音频可视化功能的音乐播放器。我希望它的功能,当我点击曲目的名称,然后该曲目应该开始播放

代码语言:javascript
运行
复制
<script src="main.js"> </script>
<script src="/circular-audio-wave.min.js"></script>
<script>

    var sel2= 'audio/audio3.mp3',
        sel1 = ''; 
    $( "li" ).click(function() {   
        sel1 =  ($(this).data('val'));     
        sel2 = 'audio/' + sel1; 

        console.log(sel2);
    });

    let wave = new CircularAudioWave(document.getElementById('chart-container'));
    wave.loadAudio(sel2);
</script>

我希望将sel2值发送到jQuery函数之外,以便'wave.loadAudio(sel2);‘可以使用它。在运行这个脚本时,我只得到了‘audio/audio o3.mp3’播放,因为我之前已经将这个值赋给了变量。我希望它设置sel2的新值(无论我单击哪个值,然后将其传递给wave.loadAudio(sel2)),以便每次单击新曲目时都能播放该曲目。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2019-07-17 16:54:49

您并不真正了解javascript中的回调函数是如何工作的,它是javascript的异步端。你的wave.loadAudio(sel2)将总是得到audio/audio3.mp3,因为它是在你的点击函数之前加载的。看看这个简单的例子:

代码语言:javascript
运行
复制
console.log('First');
setTimeout(function(){
  console.log('Second')
},0);
console.log('Third');

如果你运行这个脚本,你会看到:'First','Third','Second',因为回调函数被添加到Callback queue中,当call stack为空时,这个函数就实现了,这样回调函数就可以作为非阻塞函数使用。因此,在您的示例中,您应该将wave.loadAudio(sel2)添加到主体单击函数中:

代码语言:javascript
运行
复制
var sel2= 'audio/audio3.mp3';
let wave = new CircularAudioWave(document.getElementById('chart-container'));
sel1 = ''; 
   $( "li" ).click(function() {
     sel1 =  ($(this).data('val'));
     sel2 = 'audio/' + sel1; 
     wave.loadAudio(sel2);
});

顺便说一句,你的代码有更多的错误。尽量使用默认参数,箭头函数,不要声明全局变量( sel1 ),避免使用var,sel1应该在单击函数内部而不是外部声明。

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/57071352

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档