<table border= "0" >
<tr>
<td> Ország:</td>
<td>
<select name=" orszag" id= "orszag" size= "1" onchange= "orszag_csere(this.selectedIndex)" style= "width:200px" > </select> </td>
</tr>
<tr>
<td> Megye:</td>
<td> <select name= "megye" id= "megye" size= "1" onchange= "megye_csere(this.selectedIndex)" style= "width:200px" ></select> </td>
</tr>
<tr>
<td> Város:</td>
<td> <select name= "varos" id= "varos" size= "1" style= "width:200px" ></select> </td>
</tr>
</table>
<script type= "text/javascript" language= "javascript" >
tomb=new Array (
new Array(1 ,'Magyarország' ,
new Array (1,'Bács - Kiskun' ,
new Array (27 ,'Ágasegyháza' ),
new Array (34 ,'Akasztó' ),
new Array (88 ,'Apostag' ),
new Array (3124 ,'Zsana' )
),
new Array (16 ,'Tolna' ,
new Array (54 ,'Alsónána' ),
new Array (57 ,'Alsónyék' ),
new Array (3119 ,'Zomba' )
),
new Array (19 ,'Zala' ,
new Array (42 ,'Alibánfa' ),
new Array (45 ,'Almásháza' ),
new Array (3099 ,'Zalatárnok' ),
new Array (3100 ,'Zalaújlak' )
)
),
new Array (2 ,"Olaszország" ,
new Array (1 ,"Nem tudom milyen megyék vannak ott!" )
)
)
newOptionName = new Option("--- Kérem válasszon ---" , 0 );
document .getElementById('orszag' ).options [0 ] = newOptionName;
for(i=0 ;i<tomb.length;i++)
{
newOptionName = new Option(tomb[i][1 ], tomb[i][0 ]);
document .getElementById('orszag' ).options[i+1 ] = newOptionName;
}
v=0
function orszag_csere(mire)
{
mire--
v=mire
// Régi megye kitörlés
db=document .getElementById('megye' ).options .length
for(i=0 ;i<db;i++)
{
document .getElementById('megye' ).options [0 ]=null
}
// Régi város kitörlés
db=document.getElementById('varos' ).options .length
for(i=0 ;i<db;i++)
{
document .getElementById('varos' ).options [0 ]=null
}
if (mire>=0 )
{
newOptionName = new Option("--- Kérem válasszon ---" , 0 );
document .getElementById('megye' ).options [0 ] = newOptionName;
t=tomb[mire]
for(i=2 ;i<t.length;i++)
{
newOptionName = new Option(t[i][1 ], t[i][0 ]);
document .getElementById('megye' ).options [i-1 ] = newOptionName;
}
}
}
function megye_csere(mire)
{
mire--
// Régi megye kitörlés
db=document .getElementById('varos' ).options .length
for(i=0 ;i<db;i++)
{
document .getElementById('varos' ).options [0 ]=null
}
if (mire>=0 )
{
newOptionName = new Option("--- Kérem válasszon ---" , 0 );
document .getElementById('varos' ).options [0 ] = newOptionName;
t=tomb[v][mire+2 ]
for(i=2 ;i<t.length;i++)
{
newOptionName = new Option(t[i][1 ], t[i][0 ]);
document .getElementById('varos' ).options [i-1 ] = newOptionName;
}
}
}
newOptionName = new Option("--- Kérem válasszon ---" , 0 );
document .getElementById('orszag' ).options [0 ] = newOptionName;
for(i=0 ;i<tomb.length;i++)
{
newOptionName = new Option(tomb[i][1 ], tomb[i][0 ]);
document .getElementById('orszag' ).options [i+1 ] = newOptionName;
}
v=0
function orszag_csere(mire)
{
mire--
v=mire
// Régi megye kitörlés
db=document .getElementById('megye' ).options .length
for(i=0 ;i<db;i++)
{
document .getElementById('megye' ).options [0 ]=null
}
// Régi város kitörlés
db=document .getElementById('varos' ).options .length
for(i=0 ;i<db;i++)
{
document .getElementById('varos' ).options [0 ]=null
}
if (mire>=0 )
{
newOptionName = new Option("--- Kérem válasszon ---" , 0 );
document .getElementById('megye' ).options [0 ] = newOptionName;
t=tomb[mire]
for(i=2 ;i<t.length;i++)
{
newOptionName = new Option(t[i][1 ], t[i][0 ]);
document .getElementById('megye' ).options [i-1 ] = newOptionName;
}
}
}
function megye_csere(mire)
{
mire--
// Régi megye kitörlés
db=document .getElementById('varos' ).options .length
for(i=0 ;i<db;i++)
{
document .getElementById('varos' ).options [0 ]=null
}
if (mire>=0 )
{
newOptionName = new Option("--- Kérem válasszon ---" , 0 );
document .getElementById('varos' ).options [0 ] = newOptionName;
t=tomb[v][mire+2 ]
for(i=2 ;i<t.length;i++)
{
newOptionName = new Option(t[i][1 ], t[i][0 ]);
document .getElementById('varos' ).options [i-1 ] = newOptionName;
}
}
}
</script>
A megyék, és azok települései nem teljesek, csak a példa kedvéért van a selecteknek tartalmuk.
Az eredeti program letölthet? Micu oldaláról http://www.micsoft.hu/_adatbazis
Próbáljuk ki:
Select értéke inputboxba #select_ertek_inputba
<script type= "text/javascript" language="javascript" >
function beir( ertek){
document .getElementById('text' ).value = ertek.value;
}
</script>
<form name= "form1" >
<select id= "valami" onchange= "beir(this)" name= "valami" >
<option value=""> --Válassz--</option>
<option value= "Valami1 ">Valami1</option>
<option value= "Valami2" >Valami2</option>
<option value= "Valami3" >Valami3</option>
<option value= "Valami4" >Valami4</option>
</select>
<input type= "text" name= "text" id= "text" >
</form>
A legördülőből választott value érték fog belekerülni az inputboxunkba. Összeköthetjük a form ellenőrrel és ha üres az inbutbox, akkor nem engedjük a form feldolgozását.
Próbáljuk ki:
--Válassz--
Valami1
Valami2
Valami3
Valami4
Form ellenőrzése #form_ellenor
<style type ="
text/css ">
div#forma {
background-color:#CCCCCC;
width: 250px;
padding: 10px;
margin-top: 50px;
border: 2px solid #FF0000;
}
</style>
<script type ="
text/javascript "
language ="
javascript ">
function onlyNumbers(mibe){
x=mibe.value;
ki="";
for (i=0;i<x.length;i++){
if (x.
substr (i,1)>='0' && x.
substr (i,1)<='9'){
ki+=x.
substr (i,1);
}
}
mibe.value=ki;
}
function form_ellenor(inputok,form_neve,szoveg,password_hiba,keves_elem, keves_elem_2){
x=inputok.length;
for (i=0; i < x ; i++ )
{
aktualis_tag = inputok[i];
if (
document .forms[form_neve].elements[aktualis_tag].value == ""){
document .forms[form_neve].elements[aktualis_tag].style.background=
"RED" ;
alert (szoveg);
document .forms[form_neve].elements[aktualis_tag].
focus ();
return false;
}else{
document .forms[form_neve].elements[aktualis_tag].style.background=
"white" ;
if (inputok[i]
== "ir_szam" ){
if (
document .forms[form_neve].ir_szam.value.length < 4 ||
document. forms[form_neve].ir_szam.value.length > 4){
document .forms[form_neve].ir_szam.focus();
document .forms[form_neve].ir_szam.style.background=
"RED" ;
alert (keves_elem_2);
return false ;
}
}
if (inputok[i] ==
"jelszo" ){
ez =
document .forms[form_neve].elements[inputok[i]].value;
var tilos =
"ÖöÜüÓóÚúÉéÁáÍí" ;
for (var k=0; k< ez.length; k++)
{
for (j=0; j<tilos.length; j++)
{
if (ez.
charAt (k)==tilos.
charAt (j))
{
alert(
"Kérem ne használjon ékezetes karaktereket." );
document .forms[form_neve].ujra_jelszo.value = "";
document .forms[form_neve].elements[inputok[i]].value = "";
document .forms[form_neve].elements[inputok[i]].
focus ();
document .forms[form_neve].elements[inputok[i]].style.background=
"RED" ;
return false;
}
}
}
}
if(inputok[i]
== "ujra_jelszo" ){
if((
document .forms[form_neve].jelszo.value.length) < 5){
document .forms[form_neve].jelszo.
focus ();
document .forms[form_neve].jelszo.style.background=
"RED" ;
alert (keves_elem);
return false;
}
if(document.forms[form_neve].jelszo.value != document.forms[form_neve].elements[inputok[i]].value ){
alert (password_hiba);
document. forms[form_neve].elements[inputok[i]].value = "";
document .forms[form_neve].elements[inputok[i]].
focus ();
document .forms[form_neve].elements[inputok[i]].style.background=
"RED" ;
return false;
}
}
if (inputok[i]
== "email" ){
str=
document .forms[form_neve].elements[inputok[i]].value;
filter=
/^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i ;
if (!filter.test(str)){
document .forms[form_neve].elements[inputok[i]].
focus ();
document .forms[form_neve].elements[inputok[i]].style.background=
"RED" ;
alert (
"Kérem egy valós e-mail címet adjon meg!" );
return false;
}
}
}
}
}
</script>
<div align="center"><div id="forma">
<form name= " form_proba" method= "post" action= "#" onSubmit= "return form_ellenor(new Array('nev','ir_szam','telefon','email','jelszo','ujra_jelszo'),'form_proba','Üres mező','A jelszó és az újra jelszó mező nem egyforma tartalmú!','A jelszó legalább öt karaktert tartalmazzon!','Az irányítószám négy karakterből áll!');" >
<table border="0" cellpadding="2" cellspacing="0">
<tr>
<td> Név
</td>
<td> <input type= "text" name= "nev" value= "" /> </td>
</tr>
<tr>
<td> Irányító szám
</td>
<td> <input type= "text" name= "ir_szam" value= "" onkeyup= "onlyNumbers(this);" maxlength= "4" /> </td>
</tr>
<tr>
<td> Telefon
</td>
<td> <input type= "text" name= "telefon" value= "" /> </td>
</tr>
<tr>
<td> email
</td>
<td> <input type= "text" name= "email" value= "" /></td>
</tr>
<tr>
<td> Jelszó
</td>
<td> <input type= "password" name= "jelszo" value= "" /> </td>
</tr>
<tr>
<td> Újra jelszó
</td>
<td> <input type= "password" name= "ujra_jelszo" value= "" /> </td>
</tr>
<tr>
<td colspan="2"> <input name= "kuld_btn" type= "submit" id= "kuld_btn" value= "Elküld" /> </td>
</tr>
</table>
</form>
</div>
</div>
Próba:
Egy jól konfigurálható form ellenőr. Persze ez csak a felhasználói oldalon ellenőriz. A szerver oldalon is illik ellenőrizni a kapott adatokat. Az onSubmit-nál, a new Array() -résznél felsoroljuk, azokat az adatokat amelyeket ellenőrizni szeretnénk.
Csak a felsorolt inputokat fogja számonkérni.
Checkbox figyelése #disabled
<script type ="text/javascript " language ="javascript ">
function vizsgal(){
if (! document .getElementById("elfogad ").checked) {
document .getElementById("elkuld_btn ").disabled = true ;
} else {
document .getElementById("elkuld_btn ").disabled = false ;
}
}
</script>
<form name ="form1" method ="post" action ="index.php" >
<input type ="checkbox" name ="elfogad" id ="elfogad" value ="igen" onclick ="vizsgal();" />
A feltételek elfogadása
<br/>
<input type ="submit" name ="elkuld_btn" id ="elkuld_btn" value ="Küld" disabled ="true" />
</form>
Próba:
Kis képre kattintva egy nagy képet kapunk. #pop-up
elso_oldal.htm tartalma
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Nagy kép megjelenítő</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
<script language="JavaScript" type="text/JavaScript">
function detect() {
if (navigator.appName == 'Microsoft Internet Explorer' && navigator.platform == 'MacPPC') {
return true;
} else {
return false;
}
}
function openNewWindow(URLtoOpen, popwidth, popheight) {
var Macit = detect();
var screenWidth = screen.availWidth;
var screenHeight = screen.availHeight;
var x = (screenWidth/2)-(popwidth/2);
var y = (screenHeight/2)-(popheight/2);
if (Macit == 1) {
popwidth2 = popwidth - 16;
popheight2 = popheight - 16;
} else {
popwidth2 = popwidth;
popheight2 = popheight;
}
var winParams = "height=" + popheight2 + ",width=" + popwidth2 +",resizable=0,directories=0,dependent=1,toolbar=0,scrollbar=0,tollbar=0,screenX=" + x + ",screenY=" + y + ",left=" + x + ",top=" + y;
newWindow = window.open(URLtoOpen,'_blank', winParams);
}
</script>
</head>
<body><a href="javascript:openNewWindow('megjelenito.php?nagy_kep_url=http://www.mezofi.com/
Templates/kepek/nagy_kepek/lampion/lampion_14ha.jpg','450','447');" >
<img src="http://www.mezofi.com/Templates/kepek/lampion/lampion_14ha.jpg" width="100" height="100" border="0" alt=""/>
</a></body>
</html>
megjelenito.php tartalma.
<?php
if(isset ($_GET ["nagy_kep_url"])){
$nagy_kep_url=$_GET ["nagy_kep_url"];
}else {
print ("Nem érkezett kép cím!");
exit ;
}
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Nagy kép megjeleítő</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body style="margin: 0" onblur="parent.window.close()">
<img src="<?php echo $nagy_kep_url;?> " alt="" />
</body>
</html>
Próbáljuk ki!
Ha a nagy kép mellé kattintasz bezáródik a nagy ablak!
Megjelenítve 1 től 5 -ig (összesen 6 találatból)
Talált oldalak: 1 2
Könyv ajánlat
Témák:
Ajánlott fórumok: