javascript - ios 上的 Html5 音频 : play it in browser

Question

关于 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 除外，它不是在浏览器中播放，而是在设备播放器中打开。这是为什么？可以在浏览器中播放吗？缺什么？

谢谢!

Answer 1

<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