SetTimeout - Javascript kérdés

**Burnee** · 2010-10-20, 17:34

Sziasztok!

A cél az volt, hogy ha onMousOut van, akkor késleltetéssel eltűnjön a div.
A kód, amire azt hittem, h működni fog, a következőképpen nézett ki (illetve ezerféleképpen kipróbáltam, de nem akart működni és ez a legegyszerűbb, amivel szemléltetni tudom):

hívás:

Kód:

<div id="subidubi" onmouseout="hide('subidubi')">

hide:

Kód:

function hide ( divId ) {
setTimeout ( "document.getElementById( divId ).stlye.display = 'none'", 1250 );
}

Természetesen utánanéztem a dokumentációnak és az az érzésem, hogy alapvetően félreértelmezem a setTimeout működési mechanizmusát.

Kérem, ha valaki érti, hogy hogy is működik ez valójában, az fejtse ki bőven!
Az általános problémám az, hogy késleltést tartalmazó függvényeket, amik a késleltetéssel kapcsolatos paramétereket tudnak fogadni (esetünkben 'divId'), azokat hogyan lehet szépen (és működőképesen) legyártani?

Köszönöm a figyelmet!

Hasonló témák:

**benedictus** · 2010-10-20, 18:21

.style.visibility='hidden' -nel nem jó?

(a saját verziódban a tyle is el van írva, gondolom csak itt )

hide függvénynevet is vmi kevésbé foglalt-gyanúsra váltanám...

**Geri** · 2010-10-20, 18:22

Burnee;199697

hívás:
[CODE eredeti hozzászólása

<div id="subidubi" onmouseout="hide('subidubi')">[/CODE]

hide:

Kód:

function hide ( divId ) {
setTimeout ( "document.getElementById( divId ).stlye.display = 'none'", 1250 );
}

Az általános problémám az, hogy késleltést tartalmazó függvényeket, amik a késleltetéssel kapcsolatos paramétereket tudnak fogadni (esetünkben 'divId'), azokat hogyan lehet szépen (és működőképesen) legyártani?

Köszönöm a figyelmet!

Kód:

function hide ( divId ) {
setTimeout ( "document.getElementById(' " + divId " + " ').stlye.display = 'none'", 1250 );
}

a setTimeout stringként kapja a függvényhívást, ezért a divId az nem az aminek te akartad.

egyébként ajánlom javascript keretrendszerekkel való ismerkedést, mert sokszor megkönnyítik a dolgokat.

**benedictus** · 2010-10-20, 18:29

a hiba:
setTimeout ( document.getElementById( divId ).style.display = 'none', 1250 );

nem kellenek az idézőjelek:
setTimeout ( "document.getElementById( divId ).style.display = 'none'", 1250 );

**Geri** · 2010-10-20, 18:31

benedictus eredeti hozzászólása

a hiba:
setTimeout ( document.getElementById( divId ).stlye.display = 'none', 1250 );

nem kellenek az idézőjelek:
setTimeout ( "document.getElementById( divId ).stlye.display = 'none'", 1250 );

ezt ki is próbáltad?

mert teljesen hibás.

**Burnee** · 2010-10-20, 19:10

Szia!

A setTimeout-nál a code paramétert stringként kapja a függvény (ahogy azt Geri is írta), tehát kellenek az idézőjelek.

**Burnee** · 2010-10-20, 19:14

Köszi Geri, valószínűleg megoldottad a problémámat.
Bár ha minden igaz, lemaradt nálad is egy idézőjel.

function hide ( divId ) {
setTimeout ( "document.getElementById(' " + " divId " + " ').stlye.display = 'none'", 1250 );
}

**Geri** · 2010-10-20, 19:44

Burnee eredeti hozzászólása

Köszi Geri, valószínűleg megoldottad a problémámat.
Bár ha minden igaz, lemaradt nálad is egy idézőjel.

function hide ( divId ) {
setTimeout ( "document.getElementById(' " + " divId " + " ').stlye.display = 'none'", 1250 );
}

az előfordul. ezért jobb egy IDE-vel szerkeszeteni, mert ott jobban látszik az ilyen.

**benedictus** · 2010-10-20, 20:10

Geri eredeti hozzászólása

ezt ki is próbáltad?

mert teljesen hibás.

igazad van, hibás, de lefutni lefut, majdnem jól. Kipróbáltam, eltüntette a div-et, csak a settimeout időt figylemen kivül hagyva.

jogosan, az értékadást végrehajtotta és utána lefuttatta a none parancsot settimeouttal.

**CollisDam** · 2010-10-20, 22:13

Néha én is túlbonyolítom a dolgokat.. Most szerintem ti is ezt csináltátok

Amiket észrevettem:
- a getElement-ek mindig egy element-et keresnek. Ezt itt egyszerűen helyettesíthetitek egy this -el (ami arra az elementre vonatkozik ahol használod - így nem kell 'kikeresni')
- a setTimeout egy függvényt és egy számot vár vesszővel elválasztva: setTimeout(fuggveny,1000) -> ezért vagy írsz egy külön függvényt az eltüntetésnek, és azt hívod a setTimeout-ból, vagy megadod névtelen függvényként:
function(){ var blabla='ez egy névtelen függvény'; }
Ezeket majd a kódból megérted, ha itt nem.

Ja, és sokszor írtatok 'style.display' helyett 'stlye.display'

Szóval:

Kód:

<script>
function hide(element) {
setTimeout ( function(){ element.style.display = 'none'; }, 3000);
} 
</script>

<div onmouseout="hide(this)" style="width:50px;">teszt</div>