当reveal.js中出现某个幻灯片时执行函数

Question

我使用这个javascript框架http://lab.hakim.se/reveal-js/#/创建了一个演示文稿,当出现某个幻灯片时,我想执行函数stats(),它每隔5秒显示一次来自API的数据,但是仅当此幻灯片出现时

function stats(){                
$.ajax({
    type: "GET",
    url: url_survey,
    dataType: "json",
    success : 
      function (data) {
      //some code to display data       
    },
    error:
      //some code
}); 
}

在HTML文件中我有这个:

<section>
<div id="stats">
</div>
</section>

我该怎么做？我编写了这段代码,但它始终有效,不仅在幻灯片出现时

function check(){
if($("#stats").is(":visible"))
stats();
}

check();
setInterval(function(){check()}, 2000);

Answer 1

这可以通过使用reveal.js状态(https://github.com/hakimel/reveal.js#states)来实现.

1)向应触发方法的部分添加唯一状态.

<section data-state="stats">
    <h2>This will trigger a state event with the name "stats".</h2>
</section>

2)使用reveal.js API将侦听器添加到自定义状态.

Reveal.addEventListener( 'stats', function() {
    // Called each time the slide with the "stats" state is made visible
} );

完整的工作示例:https://gist.github.com/hakimel/cea4305a33713d4a5a7e