Visualizzazione risultati 1 fino 2 di 2

Discussione: Cambiare colore cella td in base ad intervallo

  1. #1
    unisatripboard non è connesso Neofita
    Data registrazione
    09-12-2015
    Messaggi
    17

    Predefinito Cambiare colore cella td in base ad intervallo

    Salve, ho una tabella nella mia pagina html index.html che, in base al click su un link presente in una lista di link, si riempie con il contenuto adeguato tramite ajax. Ora dovrei fare una funzione javascript che in base ad un intervallo presente nella cella si modifica di colore.
    Esempio:
    se nella cella votocamere sta un voto maggiore di 6 allora la celle deve avere sfondo verde altrimenti rosso.
    Come si fa?

  2. #2
    Guest

    Predefinito

    Con Jquery, devi fare un ciclo sulle td che ti interessano, io ti consiglio comunque di inserire una classe nella TD in questione, votocamera, altrimenti devi ciclare la table recuperare i child td, cioè fai prima a mettere un class="Votocamera" nella td del votocamera, quindi cicli le TD, per esempio se nella cella votocamera metti una class="TestoVotocamera", tutte le td votocamera avranno questo testo

    Codice:
    $('.TestoVotocamera').each(function(i,k){
      
        alert($(this).text())  
    
    });
    Una volta che hai recuperato il testo dentro il ciclo metterai if $(this).text > del voto aggiungi un css color verde...Etc...Ciao

    Così guarda, ovviamente la td votocamera deve essere un numero, la td del votocamera ha una class="votoCamera"...Ciao

    Codice:
    $('.votoCamera').each(function(){
    
      voto = ($(this).text());
      
      if (voto > 6){
        //background verde
        $(this).css('background-color','green');
      }
      else{
        //background red  
        $(this).css('background-color','red');
      }
          //Colore del testo 
          $(this).css('color','black'); 
    
    });
    Ultima modifica di fractalcosmo : 26-02-2016 alle ore 16.25.15 Motivo: Inserito tutto il codice di esempio

Regole di scrittura

  • Non puoi creare nuove discussioni
  • Non puoi rispondere ai messaggi
  • Non puoi inserire allegati.
  • Non puoi modificare i tuoi messaggi
  •