addClass with Math.round

Question

addClass with Math.round

Navigation

#1 by (1 votes)

0

I am trying to make a script in which when a sensor that is part of the test sends me a number 5, it changes the color of the table that is in red to green. That way the test would be approved.

But I'm not able to connect addClass with Math.round and to do both, another question, in the "mouseenter" would have to be an auto-read function, not an event, I looked for something like that and did not find anything.

$(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;
}

javascript jquery

asked by anonymous 29.09.2017 / 14:43

1 answer

White screen Ionic v2 API or database to achieve latitude and longitude

score 1 · Accepted Answer

I made a code example according to your question with 2 options, clicking a button and passing value and when you place the mouse over the div it generates a random code. According to this code the test proposed in your example is made and if true, add or remove the classes according to the need. See if you can.

$(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><divid="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>