Cambiare colore font nel campo

Discussione in 'Javascript' iniziata da Shyson, 28 Agosto 2012.

Tag (etichette):
  1. Shyson

    Shyson Utente Attivo

    Registrato:
    19 Agosto 2012
    Messaggi:
    1.111
    Mi Piace Ricevuti:
    1
    Punteggio:
    38
    Sesso:
    Maschio
    Questo fa uscire alert se nel campo form è stata inserita una parola proibita e lo sfondo del campo diventa rosso però la scritta rimane nera, come faccio a trasformare la scritta di color bianco su sfondo rosso?

    HTML:
    function xxx1(){ 
    var modulo = document.forms.mioform1;
    var parole = /\b(<?php echo $stringaJs; ?>)\b/i;
    var nomiCampi = ["nome","citta","suoemail","messaggio"];
    for (idCampo = 0; idCampo < nomiCampi.length; idCampo++) {
    var campo = modulo.elements[nomiCampi[idCampo]];
    if (parole.test(campo.value)) {
    campo.style.backgroundColor = "red";
    alert("La parola \"" + campo.value.match(parole)[0] + "\" non è ammessa.");
    campo.focus();
    return false
    }
     }
    return true; 
    }
    
     
  2. criric

    criric Super Moderatore Membro dello Staff SUPER MOD MOD

    Registrato:
    21 Agosto 2010
    Messaggi:
    5.607
    Mi Piace Ricevuti:
    54
    Punteggio:
    48
    Sesso:
    Maschio
    Località:
    TN
    Ciao,
    puoi provare ad aggiungere
    Codice:
    campo.style.color = "white";
     
  3. Shyson

    Shyson Utente Attivo

    Registrato:
    19 Agosto 2012
    Messaggi:
    1.111
    Mi Piace Ricevuti:
    1
    Punteggio:
    38
    Sesso:
    Maschio
    L'avevo già provato, in effetti colora il font di bianco, solo che poi rimane bianco, non torna nero, mentre invece lo sfondo rosso poi scompare
     
  4. criric

    criric Super Moderatore Membro dello Staff SUPER MOD MOD

    Registrato:
    21 Agosto 2010
    Messaggi:
    5.607
    Mi Piace Ricevuti:
    54
    Punteggio:
    48
    Sesso:
    Maschio
    Località:
    TN
    hai provato anche aggiungendo un else ?
    Codice:
    if (parole.test(campo.value)) {
                    campo.style.backgroundColor = "red";
                    campo.style.color = "white";
                    alert("La parola \"" + campo.value.match(parole)[0] + "\" non è ammessa.");
                    campo.focus();
                    return false
                }else{
                    campo.style.color = "black";  
                }
     
  5. Shyson

    Shyson Utente Attivo

    Registrato:
    19 Agosto 2012
    Messaggi:
    1.111
    Mi Piace Ricevuti:
    1
    Punteggio:
    38
    Sesso:
    Maschio
    Così non esce nemmeno l'alert
     
  6. criric

    criric Super Moderatore Membro dello Staff SUPER MOD MOD

    Registrato:
    21 Agosto 2010
    Messaggi:
    5.607
    Mi Piace Ricevuti:
    54
    Punteggio:
    48
    Sesso:
    Maschio
    Località:
    TN
    io intendevo insieme a tutto il resto
    Codice:
    <script>
        function xxx1(){ 
            var modulo = document.forms.mioform1;
            var parole = /\b(<?php echo $stringaJs; ?>)\b/i;
            var nomiCampi = ["nome","citta","suoemail","messaggio"];
            for (idCampo = 0; idCampo < nomiCampi.length; idCampo++) {
                var campo = modulo.elements[nomiCampi[idCampo]];
                if (parole.test(campo.value)) {
                    campo.style.backgroundColor = "red";
                    campo.style.color = "white";
                    alert("La parola \"" + campo.value.match(parole)[0] + "\" non è ammessa.");
                    campo.focus();
                    return false
                }else{
                    campo.style.color = "black";  
                }
            }
            return true; 
        }
    </script>
    
    non va?
     
  7. Shyson

    Shyson Utente Attivo

    Registrato:
    19 Agosto 2012
    Messaggi:
    1.111
    Mi Piace Ricevuti:
    1
    Punteggio:
    38
    Sesso:
    Maschio
    Così non esce nemmeno lo sfondo rosso
     
  8. criric

    criric Super Moderatore Membro dello Staff SUPER MOD MOD

    Registrato:
    21 Agosto 2010
    Messaggi:
    5.607
    Mi Piace Ricevuti:
    54
    Punteggio:
    48
    Sesso:
    Maschio
    Località:
    TN
    puoi postare anche l'html del form?
     
  9. Shyson

    Shyson Utente Attivo

    Registrato:
    19 Agosto 2012
    Messaggi:
    1.111
    Mi Piace Ricevuti:
    1
    Punteggio:
    38
    Sesso:
    Maschio

    PHP:
    <!-- Inizio codice POPUP-Scrivimi1 -->
                                                                                              
    <div id="popup-Scrivimi1"> 

    <div id="chiudi-Scrivimi1">
    <a href="#" onclick="body.style.overflow='auto';document.getElementById('shade').style.display='none';document.getElementById('chiudi-Scrivimi1').style.display='none';document.getElementById('popup-Scrivimi1').style.display='none'">Close</a>  
    </div>  <!-- chiudi-Scrivimi1 -->

    <div id="headerFormScrivimi1">Scrivimi</div>

    <form method="post" action="scrivimi2.php" id="mioform1" onkeyup="highlight(event)" onsubmit="return (xxx1()&amp;&amp;controlla1())">

    <!-- Prende la data-ora browser del visitatore da script.js WebDate_Scrivimi() -->
     <input type="hidden" id="hdn_data_locale" name="WebDate_Scrivimi" />
      <script type="text/javascript">WebDate_Scrivimi();</script>   
        
                <fieldset id="contenuto1"> 
                 <div class="linea1">
                     <label class="nomi1Scriv">Tuo NOME<span class="asterisco1">&nbsp;*</span></label>
              <input type="text" name="nome" class="campi1" value="<?php echo($_SESSION['nome'])?>" onkeyup="contaNomeScrivimi1(this.form);" onblur="this.value=this.value.replace(/[\s]*/,'')" /> 
               &nbsp;&nbsp;&nbsp;&nbsp;<img src="faccine/cxonfuso.gif" alt="Confuso" title="Confuso" onclick="document.forms.mioform1.messaggio.value+='CONFUSO';focus()" style="cursor:pointer" />
                            &nbsp;&nbsp;<img src="faccine/ixmpossibile.gif" alt="Impossibile" title="Impossibile" onclick="document.forms.mioform1.messaggio.value+='IMPOSSIBILE';focus()" style="cursor:pointer" />
                          &nbsp;<img src="faccine/txestardo.gif" alt="Testardo" title="Testardo" onclick="document.forms.mioform1.messaggio.value+='TESTARDO';focus()" style="cursor:pointer" />
                   </div>
                       <div class="linea1">
               <label class="nomi1">Tua CITT&Agrave;</label>
           <input type="text" name="citta" class="campi1" value="<?php echo($_SESSION['citta'])?>" onkeyup="contaCittaScrivimi1(this.form);" onblur="this.value=this.value.replace(/[\s]*/,'')" />
                        &nbsp;&nbsp;&nbsp;&nbsp;<img src="faccine/pxiange.gif" alt="Piange" title="Piange" onclick="document.forms.mioform1.messaggio.value+='PIANGE';focus()" style="cursor:pointer" />
                        &nbsp;&nbsp;<img src="faccine/bxacio.gif" alt="Bacio" title="Bacio" onclick="document.forms.mioform1.messaggio.value+='BACIO';focus()" style="cursor:pointer" />
              &nbsp;&nbsp;<img src="faccine/fxelice.gif" alt="Felice" title="Felice" onclick="document.forms.mioform1.messaggio.value+='FELICE';focus()" style="cursor:pointer" />
             </div>
                      <div class="linea1">
                     <label class="nomi1">Tua EMAIL<span class="asterisco1">&nbsp;*</span></label>
               <input type="text" name="suoemail" class="campi1" value="<?php echo($_SESSION['suoemail'])?>" onkeyup="contaEmailScrivimi1(this.form);" onblur="this.value=ignoreSpaces(this.value)" />   <!-- Rimuove tutti gli spazi (attacca le parole) -->
                    &nbsp;&nbsp;&nbsp;&nbsp;<img src="faccine/rxide.gif" alt="Ride" title="Ride" onclick="document.forms.mioform1.messaggio.value+='RIDE';focus()" style="cursor:pointer" />
               &nbsp;&nbsp;<img src="faccine/oxcchiolino.gif" alt="Occhiolino" title="Occhiolino" onclick="document.forms.mioform1.messaggio.value+='OCCHIOLINO';focus()" style="cursor:pointer" />
                        &nbsp;&nbsp;<img src="faccine/cxiao.gif" alt="Ciao" title="Ciao" onclick="document.forms.mioform1.messaggio.value+='CIAO';focus()" style="cursor:pointer" />
                     </div>
                     
            <div class="linea1">
                <div class="formattazione1">
                
          <div id="bottoneG">         
          <a href="javascript:insert_tag('G');">G</a>
          </div>
          <div id="bottoneC"> 
          <a href="javascript:insert_tag('C');">C</a>    
          </div>
          <div id="bottoneS"> 
          <a href="javascript:insert_tag('S');">S</a>
          </div> 
    <select class="campoColori1" onchange="insert_tag('COLOR',this.options[this.selectedIndex].value);this.selectedIndex=0;">
    <option>Color</option> 
    <option class="cayenne-bg" value="cayenne">Cayenne</option>
    <option class="rosso-bg" value="rosso">Rosso</option>
    <option class="verde-bg" value="verde">Verde</option>
    <option class="grigio-bg" value="grigio">Grigio</option>
     </select>
          </div> <!-- formattazione1 -->
                </div>  <!-- linea1 -->
       </fieldset> <!-- contenuto1 -->
        
         <div id="contSX">
            <span class="testoMess">Testo</span><span class="asterisco1">&nbsp;*</span>
            <br />
             <br />
      <span id="charCount">Rimanenti&nbsp;<span class="formattaNumero"><span id="Contatore">1000</span></span>
       <br />
      caratteri</span>
        </div>

    <textarea name="messaggio" id="txtScrivimi1" cols="0" rows="0" onkeyup="conta(this)" onblur="this.value=this.value.replace(/[\s]*/,'')"><?php echo($_SESSION['messaggio'])?></textarea>

    <div id="contDXScrivimi1">     
       <img src="faccine/pxaura.gif" alt="Paura" title="Paura" onclick="document.forms.mioform1.messaggio.value+='PAURA';focus()" style="cursor:pointer" />
       </div>
        
         <div id="footer-sxScrivimi1">
        <span class="campiObb">Campi obbligatori</span><span class="asterisco1">&nbsp;*</span>
                        </div>
                        <div id="footer-ctScrivimi1">
                   <input type="submit" value="Invia" class="manina-guest" />
                            </div>
                            
                            <div id="footer-dxScrivimi1">
               <span class="red">Scrivi questo codice</span>
                         <br />
                <input type="text" name="validator" id="validator" onkeyup="contaValid(this.form);" onblur="this.value=ignoreSpaces(this.value)" />
                      <script type="text/javascript">Captcha();</script>
                        </div>
          </form>

           </div> <!-- popup-Scrivimi1 -->  
     
    Ultima modifica: 28 Agosto 2012
  10. criric

    criric Super Moderatore Membro dello Staff SUPER MOD MOD

    Registrato:
    21 Agosto 2010
    Messaggi:
    5.607
    Mi Piace Ricevuti:
    54
    Punteggio:
    48
    Sesso:
    Maschio
    Località:
    TN
    un po incasinato

    mi è venuto un dubbio pero prima di andare avanti ..

    non è che hai inserito anche <script> e </scritp> nel tuo codice ?

    solo questo semmai

    Codice:
    function xxx1(){ 
            var modulo = document.forms.mioform1;
            var parole = /\b(<?php echo $stringaJs; ?>)\b/i;
            var nomiCampi = ["nome","citta","suoemail","messaggio"];
            for (idCampo = 0; idCampo < nomiCampi.length; idCampo++) {
                var campo = modulo.elements[nomiCampi[idCampo]];
                if (parole.test(campo.value)) {
                    campo.style.backgroundColor = "red";
                    campo.style.color = "white";
                    alert("La parola \"" + campo.value.match(parole)[0] + "\" non è ammessa.");
                    campo.focus();
                    return false
                }else{
                    campo.style.color = "black";  
                }
            }
            return true;
    }
    
     
  11. Shyson

    Shyson Utente Attivo

    Registrato:
    19 Agosto 2012
    Messaggi:
    1.111
    Mi Piace Ricevuti:
    1
    Punteggio:
    38
    Sesso:
    Maschio
    Si, ho messo anche <script> perché il codice è nel file interno in head
     
  12. Shyson

    Shyson Utente Attivo

    Registrato:
    19 Agosto 2012
    Messaggi:
    1.111
    Mi Piace Ricevuti:
    1
    Punteggio:
    38
    Sesso:
    Maschio
    Il tuo codice funziona,il font diventa bianco e lo sfondo rosso, però dopo lo sfondo ridiventa bianco ma il font rimane bianco
     
  13. criric

    criric Super Moderatore Membro dello Staff SUPER MOD MOD

    Registrato:
    21 Agosto 2010
    Messaggi:
    5.607
    Mi Piace Ricevuti:
    54
    Punteggio:
    48
    Sesso:
    Maschio
    Località:
    TN
    non puo non funzionarti piu con quella modifica
    puoi postarlo per intero ( il javascript )?

    tra l'altro non capisco questa riga
    Codice:
     if (parole.test(campo.value)) {
    test cos'è? una funzione?
     
  14. Shyson

    Shyson Utente Attivo

    Registrato:
    19 Agosto 2012
    Messaggi:
    1.111
    Mi Piace Ricevuti:
    1
    Punteggio:
    38
    Sesso:
    Maschio
    Non ho una funzione chiamata test

    PHP:
    <script type="text/javascript">
    /*//<![CDATA[ <!-- Questo nasconde lo script a W3C e non esce errore -->
    function xxx1(){ 
    var modulo = document.forms.mioform1;
    var parole = /\b(<?php echo $stringaJs?>)\b/i;
    var nomiCampi = ["nome","citta","suoemail","messaggio"];
    for (idCampo = 0; idCampo < nomiCampi.length; idCampo++) {
    var campo = modulo.elements[nomiCampi[idCampo]];
    if (parole.test(campo.value)) {
    campo.style.backgroundColor = "red";
    alert("La parola \"" + campo.value.match(parole)[0] + "\" non è ammessa");
    campo.focus();
    return false;
    }
     }
    return true; 
    }
    //]]> */
    </script>
     
  15. criric

    criric Super Moderatore Membro dello Staff SUPER MOD MOD

    Registrato:
    21 Agosto 2010
    Messaggi:
    5.607
    Mi Piace Ricevuti:
    54
    Punteggio:
    48
    Sesso:
    Maschio
    Località:
    TN
    Ok, trovato! non lo conoscevo test()
    ora gli do un occhiata
     
  16. criric

    criric Super Moderatore Membro dello Staff SUPER MOD MOD

    Registrato:
    21 Agosto 2010
    Messaggi:
    5.607
    Mi Piace Ricevuti:
    54
    Punteggio:
    48
    Sesso:
    Maschio
    Località:
    TN
    Prima osservazione:
    tutto il codice javascript che hai postato è commentato perche racchiuso tra /* e */ non verrà mai eseguito
     
  17. Shyson

    Shyson Utente Attivo

    Registrato:
    19 Agosto 2012
    Messaggi:
    1.111
    Mi Piace Ricevuti:
    1
    Punteggio:
    38
    Sesso:
    Maschio
    Lo so

    Quel test che dicevi è una funzione
    Codice:
    //Colora lo sfondo del campo nel quale si sta digitando 
    function highlight(e) {
    eventobj=ns6? e.target : event.srcElement
    if (previous!='') {
    if (checkel(previous))
    previous.style.borderColor=''
    previous.style.backgroundColor=''
    previous=eventobj
    if (checkel(eventobj))
    eventobj.style.borderColor=highlightcolor
    eventobj.style.backgroundColor=highlightcolor
    }
    else {
    if (checkel(eventobj))
    eventobj.style.borderColor=highlightcolor
    eventobj.style.backgroundColor=highlightcolor
    previous=eventobj
    }
     }
    var highlightcolor="white"                      //------->Colore di sfondo
    var ns6=document.getElementById&&!document.all
    var previous=''
    var eventobj
    //Regular expression to highlight only form elements
    var intended=/INPUT|TEXTAREA|SELECT|OPTION/
    //Function to check whether element clicked is form element
    function checkel(which) {
    if (which.style&&intended.[COLOR="#FF0000"]test[/COLOR](which.tagName)) {
    if (ns6&&eventobj.nodeType==3)
    eventobj=eventobj.parentNode.parentNode
    return true
    }
    else
    return false
    }
    
     
    Ultima modifica di un moderatore: 28 Agosto 2012
  18. criric

    criric Super Moderatore Membro dello Staff SUPER MOD MOD

    Registrato:
    21 Agosto 2010
    Messaggi:
    5.607
    Mi Piace Ricevuti:
    54
    Punteggio:
    48
    Sesso:
    Maschio
    Località:
    TN
    Ho dovuto ridurre ai minimi termini e modificare qualcosa per farlo funzionare
    HTML:
    <form method="post" action="scrivimi2.php" id="mioform1">
    
        <textarea name="messaggio" cols="33" rows="4"></textarea>
    
        <input onclick="xxx1()" type="button" value="Invia"/>
    </form>
    <script type="text/javascript">
        function xxx1(){ 
            
            var modulo = document.forms.mioform1;
            var parole = /vietata/g;
            var nomiCampi = ["messaggio"];
            for (idCampo = 0; idCampo < nomiCampi.length; idCampo++) {
                var campo = modulo.elements[nomiCampi[idCampo]];            
                if (parole.test(campo.value)) {                
                    campo.style.backgroundColor = "red";
                    campo.style.color = "white";
                    alert("La parola \"" + campo.value.match(parole)[0] + "\" non è ammessa");
                    campo.focus();
                    return;
                }
            }
            modulo.submit();
        }
    </script>
    
    Domanda :
    quando deve tornare lo sfondo bianco e la scritta nera? dopo l'alert? quando cancelli la parola? quando riinizi a scrivere?
     
  19. Shyson

    Shyson Utente Attivo

    Registrato:
    19 Agosto 2012
    Messaggi:
    1.111
    Mi Piace Ricevuti:
    1
    Punteggio:
    38
    Sesso:
    Maschio
    Deve tornare quando inizio a cancellare la parola proibita...ora lo provo
     
  20. criric

    criric Super Moderatore Membro dello Staff SUPER MOD MOD

    Registrato:
    21 Agosto 2010
    Messaggi:
    5.607
    Mi Piace Ricevuti:
    54
    Punteggio:
    48
    Sesso:
    Maschio
    Località:
    TN
    provalo cosi
    HTML:
    <form method="post" action="scrivimi2.php" id="mioform1">
    
        <textarea onkeyup="xxx1()" name="messaggio" cols="33" rows="4"></textarea>
    
        <input type="submit" value="Invia"/>
    </form>
    <script type="text/javascript">
        //<![CDATA[ <!-- Questo nasconde lo script a W3C e non esce errore -->
        function xxx1(){ 
            
            var modulo = document.forms.mioform1;
            var parole = /vietata/g;
            var nomiCampi = ["messaggio"];
            for (idCampo = 0; idCampo < nomiCampi.length; idCampo++) {
                var campo = modulo.elements[nomiCampi[idCampo]];            
                if (parole.test(campo.value)) {                
                    campo.style.backgroundColor = "red";
                    campo.style.color = "white";
                    alert("La parola \"" + campo.value.match(parole)[0] + "\" non è ammessa");
                    campo.focus();
                    return false;
                }else{
                    campo.style.backgroundColor = "white";
                    campo.style.color = "black";
                }
            }
            return true
        }
        //]]> 
    </script>
    
     
Sto caricando...

Condividi questa Pagina