JavaScript的播放/暂停音频切换

Question

这里是一个的jsfiddle：

http://jsfiddle.net/8LczkwLz/19/

HTML：

<audio class="flashcardAudio" preload='none'> 
    <source src="http://dl.dropbox.com/u/1538714/article_resources/song.m4a" type='audio/mpeg' /> 
</audio> 

<a class="speakerClicked"> 
    <img src="http://codropspz.tympanus.netdna-cdn.com/codrops/wp-content/uploads/2010/01/play1-150x150.png"/> 
</a> 

JS：

var flashcardAudio = document.getElementsByClassName('flashcardAudio'), 
control = document.getElementsByClassName('speakerClicked'); 

control.onclick = function() { 
    pause_html='<img src="https://cdn2.iconfinder.com/data/icons/media-and-navigation-buttons- square/512/Button_4-128.png">'; 
    speaker_html='<img src="http://codropspz.tympanus.netdna-cdn.com/codrops/wp-content/uploads/2010/01/play1-150x150.png">'; 

    // Update the Button 
    var pause = control.innerHTML === pause_html; 
    control.innerHTML = pause ? speaker_html : pause_html; 

    // Update the Audio 
    var method = pause ? 'pause' : 'play'; 
    flashcardAudio[method](); 

    // Prevent Default Action 
    return false; 
}; 

上播放按钮的点击，我想看到它切换到暂停按钮，反之亦然。似乎是在JS中输入函数的问题，但由于警报消息从不触发。

Answer 1

你忘了针对特定的元素，仅仅通过更换您的JS line 1 and 2：

var flashcardAudio = document.getElementsByClassName('flashcardAudio')[0], 
control = document.getElementsByClassName('speakerClicked')[0]; 

，并删除在暂停按钮IMG URL的空间。

查看jsfiddle