refleksy - Tekstunie na M - Profile sufitowe - Pracnet - tonery sharp - kredyt samochodowy - nieruchomości w Krakowie - Śmieszne prezentacje - pikniki firmowe - Ceramika łazienkowa - programy dla biura - pożyczki gotówkowe - lokata - Renowacja antyków

<<<

Projektowanie stron internetowych
[Zdarzenia][Obiekty w oknie]

Obiekty w oknie

Obiekt window (okno) składa się z pasku statusu oraz metod obiektów z którymi zapoznasz się w dalszej części kursu.

Wiersz stanu definiowany jest według poniższego wzoru:

window.status = "tekst komunikatu"

Przykład skryptu z wykorzystaniem obiektu window.status.

Chcemy stworzyć link do strony np. http://wp.pl ,który na wskutek nakierowania na niego kursora myszki wyświetla komunikat w pasku stanu [patrz]

Na początek napiszmy definicję linku w HTMLu:

<A HREF="http://wp.pl">Wirtualna Polska</a>

Teraz stwórzmy kod JavaScript

<script language="JavaScript">
function zmieniacz()
{
window.status = "Wirtualna Polska";
}
function puste()
{
window.status = " ";
}
</script>

Teraz w kodzie linku dopisujemy poniższy fragment :

<A HREF="http://wp.pl" onMouseOver="zmieniacz()" onMouseOut="puste()">

Jak widać funkcja puste() powoduje wyczyszczenie okienka statusu.

Metody obiektu window

Alert()

Metoda alert tworzy okienko dialogowe w którym możemy umieścić jakąś informację tekstową. [patrz]

Ogólny wzór komendy alert przedstawia poniższy wzór:

window.alert("tekst komentarza")

Rozważmy teraz poniższy przykład:

Otóż chcemy stworzyć przycisk formularza który na wskutek naciśnięcia powiadamiał nas komunikatem "Witaj"

Najpierw zdeklarujmy kod przycisku formularza:

<form>
<input type="button" value="Naciśnij mnie">
</form>

Teraz napiszmy odpowiedni kod JavaScript:

<script language="JavaScript">
function powitanie()
{
window.alert("Witaj")
}
</script>

Teraz dodajmy do kodu przycisku poniższy kod:

<form>
<input type="button" value="Naciśnij mnie" onClick="powitanie()">
</form>

No i gotowe :)

W okienkach dialogowych tekst można formatować np.:

\n - oznacza nową linię

\t - oznacza tabulację

Confirm()

Confirm jest podobna do metody alert z tą różnicą iż okienko dialogowe posiada dwa przyciski "OK." oraz "CANCEL".

Ogólna deklaracja confirm ma postać :

window.confirm("tekst komunikatu")

Przykład:

Chcemy stworzyć skrypt sprawdzający czy w podany email jest wpisany poprawnie.W tym celu piszemy poniższy kod:

<script language="JavaScript">
function sprawdzaj()
{
znaczek = document.formularz.pole.value.indexOf ("@");
if (znaczek == -1)
{
window.alert("To nie jest adres email!!\nTy wstrętny kłamco!!!\n");
return false
}
else
{
var adres = "Wpisałeś " + document.formularz.pole.value + "\n" + "Czy email się zgadza?";
return window.confirm(adres)
};
}</script>

Teraz w kodzie HTML piszemy:

<form name="formularz">
<Input type="text" name="pole">
<Input type="button" value="Sprawdź adres email" onClick="sprawdzaj()">
</form>

Większość poleceń powinieneś znać, gdyż została wyjaśniona w poprzednich lekcjach kursu.Jedyna obca ci komenda to indexOf ("@") - otuż polecenie to poszukuje znaku zawartego w cudzysłowiu "".

Prompt()

Wyświetla okno dialogowe do którego użytkownik może coś wpisać. Ogólny schemat metody wygląda następująco :

Jakaśzmienna = window.prompt("wyświetlony komunikat","wartość_domyślna")

Wyświetlony komunikat to tekst z którym pojawia się okienko, natomiast wartość domyślna to wartość zwracana przez metodę przy braku danych ze strony użytkownika.

Przykład:

Chcemy stworzyć skrypt który przy podaniu wieku dopuszczałby do strony niespodzianki.

<script language="JavaScript">

function wiek()
{
var wiek = window.prompt ("Ile masz lat?","");
if ( wiek <18 )
{
window.alert("Jesteś za młody aby oglądać tę stronę !!!");
}
else
window.location.herf="http://www.whitehouse.com" ;
}
</script>

Jedyną komendą jaką nie znasz jest window.location.href="link". Komenda ta powoduje wczytanie się strony o podanym linku.

Aby kod zadziałał w sekcji <BODY> musisz dopisać:

<BODY onLoad="wiek()">

To spowoduje iż przy wczytywaniu strony okienko prompt() pojawi się.

Projektowanie stron internetowych Copyright(c) 1998 by Robert Fontański