javascript - byta färg på div

Hej WebForum!

Jag sitter med ett projekt där jag har ett registreringsformulär, det jag vill är att när man skriver in något eller inget i en <input type="text"> ska #div-blocket byta färg, antar att jag ska använda mig av "onblur" då jag inte vill att man ska behöva trycka på en knapp för att detta ska ske, sitter fast med själva skiftet av färgen, ett bra exempel är Flashback.

Tack på förhand!

Hej, och välkommen till wF.

Om du bara vill kolla om fältet är tomt eller inte kan du göra så här.

<div id="div-blocket">
Namn <input type="text" name="namn" onblur="document.getElementById('div-blocket').style.backgroundColor=(this.value)?'green':'red';";>
</div>

Jojoxx skrev:

Hej, och välkommen till wF.

Om du bara vill kolla om fältet är tomt eller inte kan du göra så här.

<div id="div-blocket">
Namn <input type="text" name="namn" onblur="document.getElementById('div-blocket').style.backgroundColor=(this.value)?'green':'red';";>
</div>

Tack!
Jo det är exakt så jag vill att den ska fungera men,skulle gärna vilja kolla om det tex är längre än 2
[if(username < 2){
style.backgroundColor='red']

eller kolla om emails är valida tex kolla om den innehåller '@' och '.' och att lösenorden stämmer överens.

Tack på förhand!

Typ såhär:

<script>
String.prototype.isValidEmail = function(){
	return !!this.match(/^[a-zA-Z0-9]+([\.\-\_]{1}[a-zA-Z0-9]+)*\@[a-zA-Z0-9]+([\.\-\_]{1}[a-zA-Z0-9]+)*\.([a-zA-Z]{2,4})$/)
}
</script>

<form>
<div id="div-epost">
Epost <input type="text" name="epost" onblur="document.getElementById('div-epost').style.backgroundColor=(this.value.isValidEmail())?'green':'red';";>
</div>
<div id="div-namn">
Namn <input type="text" name="namn" onblur="document.getElementById('div-namn').style.backgroundColor=(this.value.length>2)?'green':'red';";>
</div>
<div id="div-pass">
Lösenord <input type="password" name="passwd1" onblur="document.getElementById('div-pass').style.backgroundColor=(this.value&&this.value==this.form.passwd2.value)?'green':'red';";><br />
Lösenord (igen) <input type="password" name="passwd2" onblur="document.getElementById('div-pass').style.backgroundColor=(this.value&&this.value==passwd1.value)?'green':'red';";>
</div>
</form>

Jojoxx skrev:

Typ såhär:

<script>
String.prototype.isValidEmail = function(){
	return !!this.match(/^[a-zA-Z0-9]+([\.\-\_]{1}[a-zA-Z0-9]+)*\@[a-zA-Z0-9]+([\.\-\_]{1}[a-zA-Z0-9]+)*\.([a-zA-Z]{2,4})$/)
}
</script>

<form>
<div id="div-epost">
Epost <input type="text" name="epost" onblur="document.getElementById('div-epost').style.backgroundColor=(this.value.isValidEmail())?'green':'red';";>
</div>
<div id="div-namn">
Namn <input type="text" name="namn" onblur="document.getElementById('div-namn').style.backgroundColor=(this.value.length>2)?'green':'red';";>
</div>
<div id="div-pass">
Lösenord <input type="password" name="passwd1" onblur="document.getElementById('div-pass').style.backgroundColor=(this.value&&this.value==this.form.passwd2.value)?'green':'red';";><br />
Lösenord (igen) <input type="password" name="passwd2" onblur="document.getElementById('div-pass').style.backgroundColor=(this.value&&this.value==passwd1.value)?'green':'red';";>
</div>
</form>

Ja precis! Tack så jätte mycket för din tid och hjälp!!

Så lite :) Glöm inte att markera lösningstråden.