jQuery&音频API - 使用.click跳到某个部分

时间:2014-04-20 21:06:32

标签: jquery api audio svg

似乎很容易做到,但我自己无法弄清楚。

我正在构建一个Web Audio可视化工具。我的HTML文件包含一个SVG,未分组和g-tags中标记的元素。一切正常。

 <g id="start"><path fill="#f03877" d="M94.168,131.995c0,0-0.073,0.121-0.201,0.332c-0.119,0.217-0.289,0.526-0.493,0.897
    c-0.409,0.742-0.955,1.731-1.5,2.72c-0.274,0.494-0.548,0.988-0.804,1.451c-0.233,0.475-0.451,0.917-0.638,1.297
    c-0.374,0.759-0.623,1.265-0.623,1.265l-25.82-12.758c0,0,0.307-0.621,0.767-1.553c0.231-0.465,0.5-1.008,0.789-1.59
    c0.313-0.569,0.646-1.175,0.98-1.781c0.669-1.212,1.338-2.424,1.84-3.332c0.252-0.454,0.461-0.832,0.608-1.097
    c0.156-0.259,0.245-0.407,0.245-0.407L94.168,131.995z" /></g>

我希望某些g-tag通过更改秒数来控制歌曲的当前时间。我已经有一些代码可以执行此操作,并且在加载页面时它可以正常工作。

  $('audio').on('canplay', function() {
    this.currentTime = 20;
});

现在,我的问题是,如何点击其中一个SVG元素时,我如何重做那段代码?我已经尝试过jQuery click.function(),但是我失败了。

$( "#start" ).click(function() {
    $('audio').on('canplay', function() {
    this.currentTime = 20;
});

1 个答案:

答案 0 :(得分:1)

您必须使用页面中音频元素的对象。

$('audio#myaudio').currentTime = 20;

&#39; canplay&#39;事件只触发一次,当浏览器可以开始播放音频时,你不应该将它包含在onClick中。