Cambiare colore font nel campo

Shyson

Utente Attivo
19 Ago 2012
1.179
1
38
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; 
}
 
Ciao,
puoi provare ad aggiungere
Codice:
campo.style.color = "white";
 
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";  
            }
 
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";  
            }

Così non esce nemmeno l'alert
 
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?
 
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?

Così non esce nemmeno lo sfondo rosso
 
puoi postare anche l'html del form?


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:
un po incasinato

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

Così non esce nemmeno lo sfondo rosso

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

Si, ho messo anche <script> perché il codice è nel file interno in head
 
Il tuo codice funziona,il font diventa bianco e lo sfondo rosso, però dopo lo sfondo ridiventa bianco ma il font rimane bianco
 
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?
 
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?

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>
 
Prima osservazione:
tutto il codice javascript che hai postato è commentato perche racchiuso tra /* e */ non verrà mai eseguito
 
Prima osservazione:
tutto il codice javascript che hai postato è commentato perche racchiuso tra /* e */ non verrà mai eseguito
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:
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?
 
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?
Deve tornare quando inizio a cancellare la parola proibita...ora lo provo
 
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>
 

Discussioni simili