urbansunsets.com 上,我有一个HTML5音频播放器。 HTML是:

<div class="col-lg-12 col-sm-12">
    <div id="radio_player">
        <div class="default-player">
             <video width="320" height="240" controls id="audio_player">
                <source src="http://stream.radio.co/sedf8bacc9/listen" type="audio/mpeg">
            </video>
        </div>

        <div id="audioplayer">
            <button id="pButton" class="pause"></button>
            <div class="live">Live</div>
            <div id="volume_control">
                <label id="rngVolume_label" for="rngVolume">
                    <i class="fa fa-volume-up" aria-hidden="true"></i>
                </label>
                <input type="range" id="rngVolume" min="0" max="1" step="0.01" value="0.5">
            </div>
            <div class="current-piece">
                <div class="now-playing">Now playing:</div>
                <script src="https://public.radio.co/embed/sedf8bacc9/song.js"></script>
            </div>
        </div>
    </div>
 </div>

它可以在台式机/笔记本电脑和移动电话上正常运行,但IPhone除外,在iPhone上它可以在设备播放器中打开,而不是在浏览器中播放。这是为什么?可以在浏览器中播放吗?有什么不见了?

谢谢!

最佳答案

<div class="col-lg-12 col-sm-12">
    <div id="radio_player">
        <div class="default-player">
             <audio width="320" height="240" controls id="audio_player">
                <source src="http://stream.radio.co/sedf8bacc9/listen" type="audio/mpeg">
            </audio>
        </div>

        <div id="audioplayer">
            <button id="pButton" class="pause"></button>
            <div class="live">Live</div>
            <div id="volume_control">
                <label id="rngVolume_label" for="rngVolume">
                    <i class="fa fa-volume-up" aria-hidden="true"></i>
                </label>
                <input type="range" id="rngVolume" min="0" max="1" step="0.01" value="0.5">
            </div>
            <div class="current-piece">
                <div class="now-playing">Now playing:</div>
                <script src="https://public.radio.co/embed/sedf8bacc9/song.js"></script>
            </div>
        </div>
    </div>
 </div>


如果您真的只想要音频,那为什么不尝试使用<audio>而不是<video>呢?

可以看到一个iPhone可见的示例on codepen

07-28 02:32
查看更多