0

プレーヤーの再生/一時停止ボタンを切り替える2つの異なる方法を試しましたが、いずれも最初のクリックでは機能しません。何らかの理由で。

これは、おそらくオーディオのステータスをチェックして、一時停止または終了したかどうかを確認します。

function togglePlayPause() { 
var audioPlayer = document.getElementsByTagName('audio')[0];
var playpause = document.getElementById("playpause"); 
if (audioPlayer.paused || audioPlayer.ended) { 
     playpause.title = "pause"; 
     playpause.innerHTML = "pause"; 
} 
else { 
         playpause.title = "play"; 
     playpause.innerHTML = "play"; 
     } 
}

または、onClickを介して切り替えるだけのこれを試しましたtoggle(this)

 function toggle(obj) {
    if (obj.className== 'playButton') {
        obj.className = 'pauseButton';
        obj.title = "PAUSE"; 
        obj.innerHTML = "PAUSE";
    } else {
        obj.className = 'playButton';
        obj.title = "PLAY"; 
        obj.innerHTML = "PLAY";
        }
    }

ボタンが最初にクリックされたときにどちらも切り替えませんが、最初の方法はデフォルトの内部の「PLAY」から「play」に変更されるので、それは何かだと思います。

<a href="#" id="start" onclick="playPause();togglePlayPause();"><div title="play" class="playButton" id="playpause">PLAY</div></a>

どちらの方法でも、後続のクリックは正常に機能します。なぜこれが起こっているのか考えていますか?audioPlayer変数が呼び出される方法と関係がありますか?配列は0から始まります(ストローをつかんでいます)。

いつもありがとう!

4

1 に答える 1

-1

関数を作成せずに、リンクがクリックされているかどうかを確認してから、発生するイベントに進みます。

だから、のようなもの$("#start").click(function(){});を試すことができます。

まず、jQueryライブラリをHTMLヘッダーに含めます。

次に、新しいjavascriptファイルを作成し、それも含めます(通常、これは含まれるjQueryの後に配置されます)

新しいJavaScriptファイルに次のように記述します

$(document).ready(function() {
   $("#start, #stop, #play, #pause").click(function() { //you can have more or less selectors (selectors are the ones with #)
       //Your code goes here
   });
});

これがその解決策のフィドルです。http://jsfiddle.net/JRRm2/1/(よりきれいなテキスト: http: //jsfiddle.net/JRRm2/2/

于 2012-06-08T15:32:41.607 に答える