1
Hello, I’m trying to run an mp3 and I’m having a problem, when I click the pause button it executes the command, but soon after it runs the Play, which can be?
PLAYMUSICA.PHP
<script type="text/javascript">
$(document).ready(function() {
$('#list span').click(function() {
$.ajax({
type: "GET",
url: "play.php",
data: { file: $(this).attr('id') }
}).done(function(msg) {
$('#play').html(msg);
});
});
});
</script>
<div id="play"></div>
<div id="list">
<span id="1"><img src='images/btn-play-enable.png' title='Ouvir' alt='Play'></span> Quero Celebrar<br />
</div>
PLAY.PHP
<script type='text/javascript'>
$(document).ready(function(){
$('#play').on('click', function() {
document.getElementById('player').play();
alert('play');
});
$('#pause').on('click', function() {
document.getElementById('player').pause();
alert('pause');
});
$('#player').on('timeupdate', function() {
$('#seekbar').attr("value", this.currentTime / this.duration);
});
});
</script>
</head>
<body>
<?php
include("conexao.php");
mysqli_select_db($conn, "mg") or die("<b>Erro ". mysqli_errno() . "</b> - " . mysqli_error());
$sql1 = "SELECT musica_uid, nm_musica FROM tbl_musica WHERE id_musica = '".intval($_GET['file'])."'";
$result1 = mysqli_query($conn, $sql1);
while($consulta1 = mysqli_fetch_array($result1))
{;
$uid = $consulta1['musica_uid'];
$musica = $consulta1['nm_musica'];
}
?>
<audio id="player" autoplay preload="none">
<source src="get-musica.php?uid=<?php echo $uid; ?>" type="audio/mp3">
Your browser does not support the audio element.
</audio>
<div>
<?php echo $musica; ?><br>
<button id="play"> > </button>
<button id="pause">||</button>
<progress id="seekbar" value="0" max="1" style="width:200px;"></progress><br><br>
</div>
</body>
</html>
try putting on the button. type="button"
– Emir Marques
Could post as it is calling the file
.mp3
? Your code is working here– Randrade
Where is the ID="player" element in your HTML?
– PauloHDSousa
I edited the question to see if it is clearer my doubt... VLW
– Ricardo
Have you tried checking the status before applying the action ?
– Edilson
@Edilson not! How would you do that?
– Ricardo
So? if (player.paused) {....
– Ricardo
var vid = $('#play'); vid.on('click', function(){ if(vid.paused){ vid.play(); } else { vid.pause(); } })
- Refine this.– Edilson