0

曲のタイトルをクリックすると埋め込みタグのソースを変更する関数を作成しています。これは Chrome と Firefox では機能しますが、Internet Explorer では機能しません。

関数は次のとおりです。

function loadSong(title) {
    var wav = "samples/" + title + ".wav";
    var ie = "<embed id='ie' src='" + wav + "'></embed>";
    if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)) { 
        //test for MSIE x.x
        var newSong = document.getElementById("playerwrapper")
        newSong.innerHTML = ie;
    } else {
        var audio = document.getElementById("audio");  
        audio.pause();
        audio.src = wav;
        audio.play();
    }
}

はい、Chrome と Firefox で埋め込みプレーヤーを試し、IE で html5 オーディオ要素を m4a ファイルで使用してみました (ソースは Chrome と Firefox と同じ方法で変更されています)。

次に、これはオーディオ プレーヤー自体です (念のために全体を含めます。無関係である場合は申し訳ありません)。

<?php
if($samples == 1) {
    if (isset($_SERVER['HTTP_USER_AGENT']) && 
        (strpos($_SERVER['HTTP_USER_AGENT'], 'MSIE') !== false)) 
    {
        print "
            <div id='playrwrapper'>
                <embed id='ie' src='samples/alright.wav' autostart='false'>
                </embed>
            </div>";
    } else {
        print "
            <div id='playerwrapper'>
                <audio id='audio' preload='auto' tabindex='0' controls>
                    <source id='wav' type='audio/wav' src='samples/alright.wav'/>
                </audio>
            </div>";
    };
};
?>

最後に、関数の呼び出し方法は次のとおりです。

<p onclick='loadSong("songtitle")'>Song Title</p>
<p onclick='loadSong("anothersongtitle")'>Another Song Title</p>
<p onclick='loadSong("doomkittiesofmars")'>Doom Kitties of Mars</p>

アドバイスをお寄せいただきありがとうございます。

4

1 に答える 1

1

IEはビッチですね。

objectソースが変更された場合、IE は要素をリロードしません。ページがロードされたときにのみロードされます。

では、それを回避するにはどうすればよいでしょうか。シンプル: 既存の要素を複製し、古い要素を削除して、新しい要素を追加します。例：

// innerHTML bla bla bla
newS = newSong.cloneNode( true ) // Deep copy
newSong.parentNode.replaceChild( newS, newSong )
于 2012-04-21T06:04:13.693 に答える