Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

196
Visualizações
Play a sound when a certain value is selected on slider

I'm trying to make a simple slider that when choosing a certain value on it (in this case 76), the button that says "Continue" plays a certain sound instead of redirecting, but i don't seem to get it to work, could you guys help me out on this? here is the snippet.

           <div id="Slider">
        <span id="rangeValue">0</span>
        <Input class="range" type="range" name "" value="0" min="0" max="100" onChange="rangeSlide(this.value)" onmousemove="rangeSlide(this.value)"></Input>
    </div>
    <script type="text/javascript">
        function rangeSlide(value) {
            document.getElementById('rangeValue').innerHTML = value;
        }
    </script>
<button class="btn-1" id="i22w3" onclick="play()">Continue</button>
<audio id="audio" src="https://www2.cs.uic.edu/~i101/SoundFiles/BabyElephantWalk60.wav"></audio>
<script type="text/javascript">

var audio = document.getElementById("audio");
      function play() {
        if ('rangeValue' = 76) {
   audio.play();
} else {
   window.location.replace("https://example.com/");
}
        

Thank you in advance!

about 4 years ago · Juan Pablo Isaza
2 Respostas
Responde à pergunta

0

you have an error in your code

equality in JS https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Strict_equality

and 'rangeValue' should be a variable -> value from slider

function play() {
  if ('rangeValue' === 76) { // missing `===`
     audio.play();
  } else {
     window.location.replace("https://example.com/");
  }
}
about 4 years ago · Juan Pablo Isaza Relatório

0

Fixed a few things in the code, a couple of which could have been from forgetting to copy the bottom couple of lines 😉.

<div id="Slider">
        <span id="rangeValue">0</span>
        <Input class="range" type="range" name "" value="0" min="0" max="100" onChange="rangeSlide(this.value)" onmousemove="rangeSlide(this.value)"></Input>
    </div>
    <script type="text/javascript">
        function rangeSlide(value) {
          document.getElementById('rangeValue').innerHTML = value;
        }
    </script>
<button class="btn-1" id="i22w3" onclick="play()">Continue</button>

<script>
 function play() {
   const rangeValue = document.getElementById('rangeValue').textContent;
   if (rangeValue === "76") {
     console.log('play sound')
   } else {
     console.log('replace')
   }
 }
</script>

Test it here

What I did:

  • Close the script tag and closure in the bottom (probably due to how it was copied)
  • Declare and set a value to rangeValue in play() because right now it's just a string: 'rangeValue'.
  • Change the if statement test from = to ===

That's it, just replace my console logs with what you want and re-add the elements I deleted and it should work.

about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda