0

Estou tentando fazer um script no qual quando um sensor que faz parte do teste me manda um numero 5, ele muda a cor da tabela que está em vermelho para verde. Dessa forma o teste estaria aprovado.

Porém não estou conseguindo interligar o addClass com o Math.round e fazer funcionar ambos, outra dúvida, no "mouseenter" teria que ser uma função de leitura automática, e não um evento, procurei algo do tipo e não encontrei nada.

$(function(){
    $('#sensorValor').mouseenter(function () {
        roundedValue = Math.round(parseFloat(sensorValor) *100 / 100;
        if((roundedValue >=5) && testEnable){
          $('sensorValor').addClass('bad_3');
        })
    });


.bad_3{
 border: 10px solid green;
}
2
  • Faltou um parênteses de fechamento na função Math.round Commented 29/09/2017 às 12:51
  • valeu mas mesmo assim ainda não funcionou Commented 29/09/2017 às 12:54

1 Resposta 1

1

Fiz um exemplo de código de acordo com sua pergunta com 2 opções, clicando em um botão e passando valor e, quando coloca o mouse sobre a div gera um código aleatório. De acordo com este código é feito o teste proposto em seu exemplo e se for verdadeiro, adiciona ou remove as classes de acordo com a necessidade. Veja se lhe atende.

$(function() {

  var sensor = 0,
    testEnable = true;

  window.teste = function teste(value) {

    if (value != undefined) {
      sensor = Number(value);
    } else {
      sensor = geraNumeroAleatorio();
      console.log("Número aleatório gerado: %s", sensor);
    }

    if ((sensor >= 5) && testEnable) {
      $("#trocaCorSensor").removeClass('yellow').addClass('green');
    } else {
      $("#trocaCorSensor").addClass('yellow').removeClass('green');
    }
  }

  function geraNumeroAleatorio() {
    return Math.round(Math.random() * 10)
  }

});
.yellow {
  background-color: yellow;
}

.green {
  background-color: green;
}

button {
  min-width: 120px;
  padding: 5px;
  margin-bottom: 5px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="trocaCorSensor" onmouseover="teste()">
  <p>Conteúdo...</p>
</div>

<button class="yellow" onClick="teste(1)">Teste Valor 1</button>
<button class="yellow" onClick="teste(2)">Teste Valor 2</button>
<button class="yellow" onClick="teste(3)">Teste Valor 3</button>
<button class="yellow" onClick="teste(4)">Teste Valor 4</button>
<button class="green" onClick="teste(5)">Teste Valor 5</button>
<button class="green" onClick="teste(6)">Teste Valor 6</button>
<button class="green" onClick="teste(7)">Teste Valor 7</button>
<button class="green" onClick="teste(8)">Teste Valor 8</button>
<button class="green" onClick="teste(9)">Teste Valor 9</button>
<button class="green" onClick="teste(10)">Teste Valor 10</button>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .