¿Quiero hacer clic en diferentes audios en html (sin saltar a la página)?
Primero, debe establecer una ID única para cada imagen en el HTML y establecer una ID única para cada archivo de audio.
Luego puedes usar JavaScript para monitorear el evento de clic de la imagen y reproducir el archivo de audio correspondiente cuando ocurre el evento de clic.
Aquí hay un ejemplo básico:
HTML:
Lenguaje de marcado de hipertexto
ltimg id = " img 1 " src = " img 1 jpg " alt = " Imagen 1 "/ gt;
ltimg id = " img 2 " src = " img 2 jpg " alt = " Imagen 2 "/ gt;
ltaudio id = " audio 2 " src = " audio 2 . MP3 " preload = " auto " gt; lt/audio gt;
JavaScript:
lenguaje de descripción java
document. addEventListener('click ', function() {
document . getelementbyid(' audio 1 '). play();
});
document. getElementById('img2 '). addEventListener('click ', function() {
document.getelementbyid('audio 2').play();
});
En este En el ejemplo, cuando hace clic en la imagen con el ID "img1", se reproducirá el archivo de audio con el ID "audio1"; cuando hace clic en la imagen con el ID "img2", se reproducirá el archivo de audio con el ID "; Se reproducirá audio2". Tenga en cuenta que el atributo preload="auto " puede hacer que el archivo de audio comience a cargarse cuando se carga la página para aumentar la velocidad de reproducción.
Tenga en cuenta que este es solo un ejemplo básico y es posible que deba modificarlo para adaptarlo a sus necesidades específicas. Por ejemplo, es posible que necesites manejar la situación en la que el archivo de audio no existe o no se puede reproducir, o agregar algunas funciones para controlar la reproducción de audio (como pausar, detener, ajustar el volumen, etc.).