Skip to main content
Só para facilitar, você pode chamar o removeClass imediatamente na frente! :D
Fonte Link

Utilize jQuery :) você pode utilizar "on change" com uma class para otimização de código. Aí basta adicionar a "class" onde quiser aplicar as cores. Segue um exemplo:

$(document).ready(function(){

  $('.valor').on('change',function(){
    var valor = $(this).val();

    if(valor < 25){
      $(this).addClass("negativo")
      $(this).removeClass("positivo");
    }else{
      $(this).addClass("positivo");
      $(this).removeClass("negativo");
    }
  });
  
});
.negativo {
  background: red;
  color: #fff;
}

.positivo {
  background: green;
  color: #fff;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<label for="valor_unitario">Vlr. Unit.</label>
<input type="text" name="valor_unitario" id="valor_unitario" class="valor" required>

O código faz é adicionar uma class "positiva" ou "negativa" de acordo com o valor. Você pode criar quantas possibilidade quiser. Positiva, negativa, neutra, etc.

Utilize jQuery :) você pode utilizar "on change" com uma class para otimização de código. Aí basta adicionar a "class" onde quiser aplicar as cores. Segue um exemplo:

$(document).ready(function(){

  $('.valor').on('change',function(){
    var valor = $(this).val();

    if(valor < 25){
      $(this).addClass("negativo")
      $(this).removeClass("positivo");
    }else{
      $(this).addClass("positivo");
      $(this).removeClass("negativo");
    }
  });
  
});
.negativo {
  background: red;
  color: #fff;
}

.positivo {
  background: green;
  color: #fff;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<label for="valor_unitario">Vlr. Unit.</label>
<input type="text" name="valor_unitario" id="valor_unitario" class="valor" required>

O código faz é adicionar uma class "positiva" ou "negativa" de acordo com o valor. Você pode criar quantas possibilidade quiser. Positiva, negativa, neutra, etc.

Utilize jQuery :) você pode utilizar "on change" com uma class para otimização de código. Aí basta adicionar a "class" onde quiser aplicar as cores. Segue um exemplo:

$(document).ready(function(){

  $('.valor').on('change',function(){
    var valor = $(this).val();

    if(valor < 25){
      $(this).addClass("negativo").removeClass("positivo");
    }else{
      $(this).addClass("positivo").removeClass("negativo");
    }
  });
  
});
.negativo {
  background: red;
  color: #fff;
}

.positivo {
  background: green;
  color: #fff;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<label for="valor_unitario">Vlr. Unit.</label>
<input type="text" name="valor_unitario" id="valor_unitario" class="valor" required>

O código faz é adicionar uma class "positiva" ou "negativa" de acordo com o valor. Você pode criar quantas possibilidade quiser. Positiva, negativa, neutra, etc.

adicionou 87 caracteres ao conteúdo
Fonte Link

Utilize jQuery :) você pode utilizar "on change" com uma class para otimização de código. Aí basta adicionar a "class" onde quiser aplicar as cores. Segue um exemplo:

$(document).ready(function(){

  $('.valor').on('change',function(){
    var valor = $(this).val();

    if(valor < 25){
      $(this).addClass("negativo")
      $(this).removeClass("positivo");
    }else{
      $(this).addClass("positivo");
      $(this).removeClass("negativo");
    }
  });
  
});
.negativo {
  background: red;
  color: #fff;
}

.positivo {
  background: green;
  color: #fff;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<label for="valor_unitario">Vlr. Unit.</label>
<input type="text" name="valor_unitario" id="valor_unitario" class="valor" required>

O código faz é adicionar uma class "positiva" ou "negativa" de acordo com o valor. Você pode criar quantas possibilidade quiser. Positiva, negativa, neutra, etc.

Utilize jQuery :) você pode utilizar "on change" com uma class para otimização de código. Aí basta adicionar a "class" onde quiser aplicar as cores. Segue um exemplo:

$(document).ready(function(){

  $('.valor').on('change',function(){
    var valor = $(this).val();

    if(valor < 25){
      $(this).addClass("negativo");
    }else{
      $(this).addClass("positivo");
    }
  });
  
});
.negativo {
  background: red;
  color: #fff;
}

.positivo {
  background: green;
  color: #fff;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<label for="valor_unitario">Vlr. Unit.</label>
<input type="text" name="valor_unitario" id="valor_unitario" class="valor" required>

O código faz é adicionar uma class "positiva" ou "negativa" de acordo com o valor. Você pode criar quantas possibilidade quiser. Positiva, negativa, neutra, etc.

Utilize jQuery :) você pode utilizar "on change" com uma class para otimização de código. Aí basta adicionar a "class" onde quiser aplicar as cores. Segue um exemplo:

$(document).ready(function(){

  $('.valor').on('change',function(){
    var valor = $(this).val();

    if(valor < 25){
      $(this).addClass("negativo")
      $(this).removeClass("positivo");
    }else{
      $(this).addClass("positivo");
      $(this).removeClass("negativo");
    }
  });
  
});
.negativo {
  background: red;
  color: #fff;
}

.positivo {
  background: green;
  color: #fff;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<label for="valor_unitario">Vlr. Unit.</label>
<input type="text" name="valor_unitario" id="valor_unitario" class="valor" required>

O código faz é adicionar uma class "positiva" ou "negativa" de acordo com o valor. Você pode criar quantas possibilidade quiser. Positiva, negativa, neutra, etc.

Fonte Link

Utilize jQuery :) você pode utilizar "on change" com uma class para otimização de código. Aí basta adicionar a "class" onde quiser aplicar as cores. Segue um exemplo:

$(document).ready(function(){

  $('.valor').on('change',function(){
    var valor = $(this).val();

    if(valor < 25){
      $(this).addClass("negativo");
    }else{
      $(this).addClass("positivo");
    }
  });
  
});
.negativo {
  background: red;
  color: #fff;
}

.positivo {
  background: green;
  color: #fff;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<label for="valor_unitario">Vlr. Unit.</label>
<input type="text" name="valor_unitario" id="valor_unitario" class="valor" required>

O código faz é adicionar uma class "positiva" ou "negativa" de acordo com o valor. Você pode criar quantas possibilidade quiser. Positiva, negativa, neutra, etc.