Come riprodurre un file audio con jQuery?

Ho difficoltà a far funzionare l'audio con jQuery. L'ho provato con entrambi i formati .wav e .ogg. (Firefox 19.0.2)Come riprodurre un file audio con jQuery?

cliccando il Inizio pulsante rendimenti:

TypeError: buzzer.play is not a function

io non sono sicuro se selettori di jQuery restituisce un array, ma ho provato la cattura il file audio con entrambi:

var buzzer = $('buzzer');

var buzzer = $('buzzer')[0];

Senza riguardo s, non riesco a riprodurre gli elementi audio.

<!DOCTYPE html>  
<html>  
    <head>  
    <meta name="viewport" content="width=device-width, initial-scale=1">  
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>  
</head>  

<body>  

<audio id="buzzer" src="buzzer.ogg" type="audio/ogg">Your browser does not support the &#60;audio&#62; element.</audio>  
<form id='sample' action="#" data-ajax="false">  
    <fieldset>  
    <input value="Start" type="submit">  
    </fieldset>  
</form>  
<script type="text/javascript">  

var buzzer = $('buzzer')[0];  

$(document).on('submit', '#sample', function() {  
    buzzer.play();  
    return false;  
});  

</script>  
</body>  
</html>

fonte

2013-04-08 BryanWheelock

Perché dovresti utilizzare un modulo come pulsante di avvio? – adeneo

Dovresti davvero usare 'document.getElementById ('buzzer')' qui ... In realtà non stai usando * elementi jQuery-wrapped, stai solo prendendo il largo per ottenere l'elemento dom nativo. – meagar

hai dimenticato l'hash # nel selettore ID:

var buzzer = $('#buzzer')[0]; 

$(document).on('submit', '#sample', function() {  
    buzzer.play();  
    return false;  
});

E document.getElementById('buzzer') non sembra più appropriato!

Cambierei il codice HTML a:

<audio id="buzzer" src="buzzer.ogg" type="audio/ogg"></audio>  
<input type="button" value="Start" id="start" />

e fare:

$('#start').on('click', function() { 
    $('#buzzer').get(0).play(); 
});

fonte

2013-04-08 20:55:03 adeneo

Oppure '$ ('# buzzer') [0] .play();' con un bel 'event.preventDefault();' –

var buzzer = document.getElementById("buzzer");

Si può anche fare questo:

var buzzer = $('audio')[0];

E se id buzzer è unique (Come dovrebbe) si può anche fare questo - non c'è bisogno di [0]

var buzzer = $('#buzzer');

fonte

2013-04-08 20:57:23

'document.getElementById (" buzzer ");' e btw già suggerito da @adeneo –

@roXon .. true .... –

anche dopo la modifica non funzionerà come suggerito da te, hai 'Elementi' invece di' Elemento' –

Si utilizza l'id per marcare il tag audio nel codice HTML. Quindi, dovresti aggiungere # quando stai usando il selettore.

var buzzer = $('#buzzer')[0];

inoltre, si sta utilizzando ID per identificare l'audio, è anche possibile definire il vostro prezioso come questo:

var buzzer = $('#buzzer');

non c'è bisogno di aggiungere il [0], [0] si intende ottieni il primo elemento.

fonte

2016-07-21 08:56:41 athanzhang

Come riprodurre un file audio con jQuery?

risposta

Problemi correlati