jQuery是一種廣泛應用于網頁中的JavaScript庫,能夠輕松實現網頁中的動態效果。其中之一便是音樂播放功能。那么,如何使用jQuery設置按鈕播放音樂呢?
//HTML代碼 <button id="play-btn">播放</button> <audio id="bg-music" src="bg-music.mp3"></audio> //jQuery代碼 $(function(){ var audio = $('#bg-music')[0]; //獲取audio節點 $('#play-btn').click(function(){ if (audio.paused){ //音樂暫停時,點擊按鈕播放 audio.play(); $(this).text('暫停'); //按鈕文字改為暫停 } else { //音樂正在播放時,點擊按鈕暫停 audio.pause(); $(this).text('播放'); //按鈕文字改為播放 } }); });
在HTML中,通過button標簽設置播放按鈕,并通過audio標簽設置背景音樂。在jQuery代碼中,我們首先獲取audio節點,并為播放按鈕設置點擊事件,如果音樂暫停,則播放音樂并將按鈕文字改為“暫停”,反之暫停音樂并將按鈕文字改為“播放”。通過這樣簡單的代碼,我們就能實現按鈕控制音樂的播放。
上一篇css+div作用