egyetem:webc2:html5api:f5:forrasanyag
| Tantárgy: | Webes rendszerek kliens oldali programozása 2. [IM3314, WP3316] |
| Tananyag: | HTML5 - Új API-k |
| Feladat: | Készülék tulajdonosa |
Megoldás forráskódja
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Készülék tulajdonosa</title>
<meta name="author" content="Tóth Péter" />
<meta name="copyright" content="© 2012, NYME SEK" />
<meta http-equiv="date" content="2012-10-12" />
<meta name="revised" content="Tóth Péter, 12/10/2012" />
<meta name="description" content="HTML5 - Új API-k - Készülék tulajdonosa" />
<meta http-equiv="content-language" content="hu" />
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<script type="text/javascript">
<!--
// OnLoad függvény
function funcStart(){
// Lekérdezzük a tárolt tulajdonos nevét
var sNev=localStorage.getItem("nev");
// Ellenőrizzük, hogy volt-e értéke a név adatát tároló változónak
if((sNev!=null)&&(sNev.length<3)){
// Tájékozató üzenet
document.getElementById("idUzenet").innerHTML="A készüléknek nincs tulajdonosa!";
// Gomb felirata
document.getElementById("idGombMentes").value="Adatok tárolása";
}else{
// Tájékozató üzenet
document.getElementById("idUzenet").innerHTML="A készülék tulajdonosának adatai:";
// Gomb felirata
document.getElementById("idGombMentes").value="Adatok módosítása";
// Űrlapmezők beállítása
document.getElementById("idNev").value=sNev;
document.getElementById("idCim").value=localStorage.getItem("cim");
document.getElementById("idTelefon").value=localStorage.getItem("telefon");
}
}
// Adatok mentése / módosítása
function funcAdatMentes(){
// Beállított név mező értékének ellenőrzése
var sNev=document.getElementById("idNev").value;
if(sNev.length<3){
alert("Ön nem megfelelően töltötte ki a 'név' mezőt!");
return;
}
// Beállított cím mező értékének ellenőrzése
var sCim=document.getElementById("idCim").value;
if(sCim.length<3){
alert("Ön nem megfelelően töltötte ki a 'cím' mezőt!");
return;
}
// Adatok mentése
localStorage.setItem("nev",sNev);
localStorage.setItem("cim",sCim);
localStorage.setItem("telefon",document.getElementById("idTelefon").value);
// Újratöltjük a weboldalt;
location.reload();
}
// Adatok törlése
function funcAdatTorles(){
// Adatok törlése
localStorage.removeItem('nev');
localStorage.removeItem('cim');
localStorage.removeItem('telefon');
// Újratöltjük a weboldalt;
location.reload();
}
-->
</script>
</head>
<body onload="funcStart()">
<div id="idUzenet"></div>
<table>
<tbody>
<tr><td>Név:</td><td><input id="idNev" type="text" size="50" /></td></tr>
<tr><td>Cím:</td><td><input id="idCim" type="text" size="50" /></td></tr>
<tr><td>Telefonszám:</td><td><input id="idTelefon" type="text" size="50" /></td></tr>
</tbody>
</table>
<div>
<input type="button" id="idGombMentes" onclick="javascript:funcAdatMentes();" />
<input type="button" onclick="javascript:funcAdatTorles();" value="Adatok törlése" />
</div>
</body>
</html>
egyetem/webc2/html5api/f5/forrasanyag.txt · legutóbbi módosítás: – Szerkesztő: peter
