使用javascript更改媒体播放器的图标字体

Using javascript to change an icon-font for a media player?

本文关键字:图标 字体 媒体播放器 javascript 使用      更新时间:2023-09-26

我正在尝试开发一个非常简单的音频播放器,只需一个播放/暂停按钮和一个静音/取消静音按钮。

我想使用Font Awesome来显示播放/暂停和静音/取消静音的图标。

我在放代码的地方创建了一把小提琴。http://jsfiddle.net/EsC6L/

我得到一个错误"未捕获的语法错误:意外标识符"

控制台将innerHTML中的语法标识为不正确。

btnPlayPause.addEventListener("click", function() {
    if (myAudio.paused) {
        myAudio.play();
        btnPlayPause.innerHTML = "<i class="icon-pause"></i>";
    }
    else {
        myAudio.pause();
        btnPlayPause.innerHTML = "<i class="icon-play"></i>";
    }
});

btnPlayPause作为var卸载,myAudio也是如此。

在HTML方面,我有以下

    <div class="controls">
        <button id="btnPlayPause">Play</button>
        <button id="btnMute">Mute</button>
    </div><!-- /controls -->

我对如何解决这个问题感到困惑。

字符串需要转义:
btnPlayPause.innerHTML = "<i class='"icon-pause'"></i>";

演示:http://jsfiddle.net/EsC6L/2/