[JavaScript]Wykonywanie funkcji bez reloadu Opcje

[matjanos]

Witam.
Mam krótki formularz i chciałbym, aby po każdym przełączeniu focusa (kliknięciu kursorem w inny input) była wykonywana funkcja sprawdzająca poprawność zawartości własnie opuszczonego inputa.
Funkcja ta wykorzystująca innerHTML wyświetlałaby odpowiedni tekst obok inputa.
Chodzi o coś w rodzaju techniki wykorzystanej w formularzu rejestracyjnym forum.php.pl

[skowron-line]

[HTML] pobierz, plaintext 
<script type="text/javascript">
function sprawdz( obj )
{
if( obj.value == "" )
{
alert( 'blad' );
}
}
</script>
 
</script>
 
<input type="text" onclick="sprawdz( this );" onblur="sprawdz( this );">
[HTML] pobierz, plaintext 

*pisane z palca, reszte doczytaj.

[piotrooo89]

z palucha:

[HTML] pobierz, plaintext 
<script>
function pokaz(co, gdzie)
{
	var gdzie = document.getElementById(gdzie);
	gdzie.innerHTML=co;
}
</script>
<form action="" method="get">
	<input type="text" name="t1" id="t1" onBlur="pokaz(this.value, 't1l')" /><span id="t1l"></span>
	<input type="text" name="t2" id="t2" onBlur="pokaz(this.value, 't2l')" /><span id="t2l"></span>
</form>
[HTML] pobierz, plaintext 

[matjanos]

Bardzo mi pomogło! Dzięki!
Nie chcą zakładać nowego tematu zapytam od razu w tym o jeszcze jedną rzecz.
Mam taki kod (wyślę cały bo nie wiem co tu sie może przydać):

Kod

<script>
function pokaz(co, gdzie)
{
var gdzie = document.getElementById(gdzie);

if(co==""){gdzie.innerHTML="<font color='red'><ul style='list-style-image:url(images/no.gif);'><li>Błąd: Wpisz komentarz.</li></ul></font>";
gdzie1.innerHTML="<input type='submit' value='Wyślij' style='margin-left:63px; float:left;' name='sub' disabled='disabled'>";}
else if(co=="Treść komentarza"){gdzie.innerHTML="<font color='red'><ul style='list-style-image:url(images/no.gif);'><li>Błąd: Zmień komentarz z domyślnego</li></ul></font>";
gdzie1.innerHTML="<input type='submit' value='Wyślij' style='margin-left:63px; float:left;' name='sub' disabled='disabled'>";}
else gdzie.innerHTML="<font color='green'><ul style='list-style-image:url(images/yes.gif);'><li>Poprawne dane</li></ul></font>";}

function pokaz1(co, gdzie)
{
var gdzie = document.getElementById(gdzie);


if(co==""){gdzie.innerHTML="<font color='red'><ul style='list-style-image:url(images/no.gif);'><li>Błąd: Wpisz nick</li></ul></font>";
gdziesub.innerHTML="<input type='submit' value='Wyślij' style='margin-left:63px; float:left;' name='sub' disabled='disabled'>";}
else gdzie.innerHTML="<font color='green'><ul style='list-style-image:url(images/yes.gif);'><li>Poprawne dane</li></ul></font>";

}

</script>



<form action='wpisy.php' method='post'>
<div style='margin-left:60px;'>Twój nick:</div>
<span id='nick1' style="font-size:13px; float:right; line-height:1em; margin-right:70px;"> </span>
<input type="text" name="nick" onBlur="pokaz1(this.value, 'nick1')" style="float:left; margin-right:25px;margin-left:60px;"><div style="text-align:left; float:left;">
<span id='nick1' style="font-size:13px; float:right;"> </span>
<input type="checkbox" name="an" onclick="if(this.checked==true){ nick.disabled=true; nick.value='Anonim';}else{ nick.disabled=false; nick.value='';}"
id="an" style='float:both; margin-left:60px;' /><label for="an" style="font-size:10px; color:grey;">Zaznacz jeśli chcesz być anonimowy</label></div><br />




<textarea name="com" rows="8" cols="35" style="color: gray; font-style: italic; margin-left:60px; " onBlur="pokaz(this.value, 'com1')">Treść komentarza</textarea><br />



<input type="submit" value="Wyślij" style="margin-left:60px; float:left;" name="sub" id="sub" OnMouseOver="pokaz(blad, 'val')">&nbsp;&nbsp;&nbsp;&nbsp;
<span style="font-size:13px; margin-bottom:15px;" id='com1'> </span> <br />
</form>

I chciałbym żeby podczas kiedy ktoś błędnie uzupełni pole blokował się guzik submit.
co zrobic?

[skowron-line]

[HTML] pobierz, plaintext 
document.getElementsByName( 'sub' )[0].disabled = true;
[HTML] pobierz, plaintext 

To zablokuje submita.


@UP
piotrooo89 takim sposobem robi się lekki bajzel w kodzie lepiej robić to dynamicznie
javascript nextsibling

[HTML] pobierz, plaintext 
<html>
<head>
<script type="text/javascript" src="advajax.js"></script>
<script type="text/javascript">
 
function insertAfter( referenceNode, newNode )
{
	referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);
}
 
function request( object, file )
{
	var oD = document.createElement( 'div' );
	insertAfter( object, oD );
 
	advAJAX.get({
		url: file,
		mimeType: 'text/html',
		onSuccess : function(obj) 
		{
			oD.innerHTML = obj.responseText;	 
		}
	});
	object.setAttribute( 'onclick',"" );// special 4 IE
 
}
 
</script>
</head>
<body>
Just one click <br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'a.txt' );">Click me 2 get text from A file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'b.txt' );">Click me 2 get text from B file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'a.txt' );">Click me 2 get text from A file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'b.txt' );">Click me 2 get text from B file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'a.txt' );">Click me 2 get text from A file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'b.txt' );">Click me 2 get text from B file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'a.txt' );">Click me 2 get text from A file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'b.txt' );">Click me 2 get text from B file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'a.txt' );">Click me 2 get text from A file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'b.txt' );">Click me 2 get text from B file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'a.txt' );">Click me 2 get text from A file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'b.txt' );">Click me 2 get text from B file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'a.txt' );">Click me 2 get text from A file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'b.txt' );">Click me 2 get text from B file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'a.txt' );">Click me 2 get text from A file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'b.txt' );">Click me 2 get text from B file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'a.txt' );">Click me 2 get text from A file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'b.txt' );">Click me 2 get text from B file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'a.txt' );">Click me 2 get text from A file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'b.txt' );">Click me 2 get text from B file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'a.txt' );">Click me 2 get text from A file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'b.txt' );">Click me 2 get text from B file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'a.txt' );">Click me 2 get text from A file</a><br />
<a href="javascript:void(0);" onclick="javascript:request( this, 'b.txt' );">Click me 2 get text from B file</a><br />
</body>
</html>
[HTML] pobierz, plaintext 

Przykład wklejam bo nie mogłem znaleść adresu na który to wrzuciłem.

Ten post edytował skowron-line 10.07.2009, 15:55:34