Søg
Avatar billede learner Praktikant
08. april 2006 - 22:04 Der er 27 kommentarer og
1 løsning

hjælp til vent venligst besked der skal dukke op ved klik

Hej jeg har fundet en måde at lave en 'please wait..' besked, men jeg kan ikke få det til at virke som det skal. Jeg har lavet følgende:

i <head> er dette indsat:
<script>
function vent(frm) {
    t = (document.all) ? document.body.clientHeight : window.innerHeight;
    getObjS().top = (t - 30) / 2;
    getObjS().visibility = "visible";
    setTimeout("frm.submit();", 2000);
}
function getObjS() {
    if (document.getElementById)
        return document.getElementById("ventvenligst").style;
    else if (document.all)
        return document.all.ventvenligst.style;
    else if (document.layers)
        return document.nsventvenligst;
}
</script>

submit knappen ser således ud:
<input name="blabla" type="submit" onclick="vent(this);" value="Send">

nederst på siden er dette indsat:
<div id="ventvenligst" style="position: absolute; left: 0px; top: 0px; width: 100%; margin: 0px; font-size: 25px; color: red; visibility: hidden;"><strong>Please wait</strong></div>
<layer id="nsventvenligst" style="position: absolute; left: 0px; top: 0px; width: 100%; margin: 0px; font-size: 25px; color: red; visibility: hidden;"><strong>Please wait</strong></layer>
</body>

Men det virker ikke som det skal. Vent venligst beskeden fylder ikke hele skærmbilledet, men kun ca det halve. Og den <layer> er hele tiden synlig, og det skal den jo ikke være. Hvad skal jeg stille op?
Avatar billede mclemens Nybegynder
08. april 2006 - 22:42 #1
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<style type="text/css">

html,body{width:100%;height:100%;padding:0px;margin:0px;}

body{background-color:red;}

</style>

<script type="text/javascript">
<!--

function vent(frm) {
    ty = (document.all) ? document.body.clientHeight : window.innerHeight;
    tx = (document.all) ? document.body.clientWidth : window.innerWidth;

    getObjS().width = tx+"px";
    getObjS().height = ty+"px";
    getObjS().visibility = "visible";
    setTimeout("", 2000);

if(document.getElementById){setTimeout("document.getElementById('frm').submit();", 2000);}
else{setTimeout("document.body.frm.submit();", 2000);}

//setTimeout("getObjS().visibility='hidden'", 2000);

}

function getObjS() {
    if (document.getElementById)
        return document.getElementById("ventvenligst").style;
    else if (document.all)
        return document.all.ventvenligst.style;
    else if (document.layers)
        return document.nsventvenligst;
}

//-->
</script>

</head>

<body>

<form name="frm" id="frm" action="#" onsubmit="return false;">
<input name="blabla" type="submit" onclick="vent(this);" value="Send">

<div id="ventvenligst" style="position: absolute; left: 0px; top: 0px; width: 100%; margin: 0px; font-size: 25px; color: red; visibility: hidden;background-color:white"><strong>Please wait</strong></div>

<layer id="nsventvenligst" style="position: absolute; left: 0px; top: 0px; width: 100%; margin: 0px; font-size: 25px; color: red; visibility: hidden;background-color:white;"><strong>Please wait</strong></layer>
</body>

</body></html>
Avatar billede mclemens Nybegynder
08. april 2006 - 22:47 #2
fjern evt. // foran denne:
//setTimeout("getObjS().visibility='hidden'", 2000);
Avatar billede mclemens Nybegynder
08. april 2006 - 22:53 #3
hov, der kom lige 2 gange </body> med i mit eksempel :P
Avatar billede learner Praktikant
09. april 2006 - 00:17 #4
Øøøøøhhh tak :)
Men kan det ikke gøres lidt enklere?
Og jeg fatter ik rigtig det med style.. Er det nødvendigt?
Kan vi ikke bare prøve at få mit til at virke :o)

<html>
<head>
<title></title>
<script type="text/javascript">
function vent(frm) {
    ty = (document.all) ? document.body.clientHeight : window.innerHeight;
    tx = (document.all) ? document.body.clientWidth : window.innerWidth;

    getObjS().height = ty+"px";
    getObjS().width = tx+"px";
    getObjS().visibility = "visible";
    setTimeout("", 2000); // hvorfor denne linie???????

    if(document.getElementById){
        setTimeout("document.getElementById('frm').submit();", 2000);
    }else{
        setTimeout("document.body.frm.submit();", 2000);
    }
}

function getObjS() {
    if (document.getElementById)
        return document.getElementById("ventvenligst").style;
    else if (document.all)
        return document.all.ventvenligst.style;
    else if (document.layers)
        return document.nsventvenligst;
}
</script>
</head>
<body>

<form name="frm" id="frm" action="#" onsubmit="return false;">
<input name="blabla" type="submit" onclick="vent(this);" value="Send">

<div id="ventvenligst" style="position: absolute; left: 0px; top: 0px; width: 100%; margin: 0px; font-size: 25px; color: red; visibility: hidden;background-color:white"><strong>Please wait</strong></div>

<layer id="nsventvenligst" style="position: absolute; left: 0px; top: 0px; width: 100%; margin: 0px; font-size: 25px; color: red; visibility: hidden;background-color:white;"><strong>Please wait</strong></layer>

</body>
</html>
Avatar billede learner Praktikant
09. april 2006 - 00:27 #5
Jeg ønsker vel egentligt bare at der er et skjult lag, som fylder hele skærmen, som kan gøres synlig.
Avatar billede mclemens Nybegynder
09. april 2006 - 00:40 #6
setTimeout("", 2000); // hvorfor denne linie???????
-> heller ikke nødvendig... en smutter :P

Og jeg fatter ik rigtig det med style.. Er det nødvendigt?>
- Ja, hvis den skal fylde hele vinduet :)

Kan vi ikke bare prøve at få mit til at virke :o)
- ok :)
Avatar billede learner Praktikant
09. april 2006 - 00:47 #7
en anden mulighed er et lag (en div) som ligger i centrum af skærmen og som kan gøres synlig. Kan du fortælle hvordan jeg laver det?

Takker :o)
Avatar billede mclemens Nybegynder
09. april 2006 - 00:51 #8
ja, du ligger en div ind som den der ligger i eksemplet jeg lavede og placerer den via. css og position absolute midt på skærmen og gør så når man trykker på submit dukker den frem via. javascript - skal jeg lave det?
Avatar billede learner Praktikant
09. april 2006 - 00:54 #9
ja tak :)
Avatar billede mclemens Nybegynder
09. april 2006 - 01:11 #10
prøv denne:


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<script type="text/javascript">
<!--

check=0;
function vent(frm) {
document.getElementById("ventvenligst").style.display="block";
if(check==1)return true;
else{
  check=1;
  setTimeout("document.getElementById('frm').submit();", 2000);
  return false;
}
}

//-->
</script>

</head>

<body>

<form name="frm" id="frm" action="#123" onsubmit="return vent(this);">

<input name="txtbla" type="text" value="test">
<input name="blabla" type="submit" value="Send">
</form>

<div id="ventvenligst" style="position:absolute;left:50%;top:50%;width:150px;height:100px;margin:-50px 0px 0px -75px;font-size: 25px; color: red; display: none;background-color:white;text-align:center;"><br><strong>Please wait</strong></div>

</body></html>
Avatar billede mclemens Nybegynder
09. april 2006 - 01:50 #11
forslaget ovenover er baseret på dit udgangsscript der sænker afsendelsen af formularen med 2000 milisekunder... hvis det bare var fordi du ville have div til at dukke frem og ikke sænke formular afsendelsen så sig lige til...
Avatar billede mclemens Nybegynder
09. april 2006 - 11:28 #12
her er lige det eksempel der bare viser div'en:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title></head>

<body>

<form name="frm" id="frm" action="#123">

<input name="txtbla" type="text" value="test">
<input name="blabla" type="submit" value="Send" onClick="document.getElementById('ventvenligst').style.display='block';">
</form>

<div id="ventvenligst" style="position:absolute;left:50%;top:50%;width:150px;height:100px;margin:-50px 0px 0px -75px;font-size: 25px; color: red; display: none;background-color:white;text-align:center;"><br><strong>Please wait</strong></div>

</body></html>
Avatar billede learner Praktikant
09. april 2006 - 12:10 #13
Ja tak, det er det jeg har brug for.... :o) :o)
her er hvad jeg har gjort:

function vent() {
    showHideSels('hidden'); // skjuler alle <select>
    getObjS().display = "block";
}
function getObjS() {
    if (document.getElementById)
        return document.getElementById("ventvenligst").style;
    else if (document.all)
        return document.all.ventvenligst.style;
    else if (document.layers)
        return document.ventvenligst; // denne er vist ikke korrekt, vel???
}

<input name="blabla" type="submit" value="Send" onClick="vent();">

<div id="ventvenligst" style="z-index:1001;position:absolute;left:0px;top:0px;margin:0px;width:100%;height:100%;font-size:25px;color:red;background-color:white;display:none;text-align:center;"><strong><br><br><br><br><br>Vent venligts</strong><br><br>Din profil er ved at blive opdateretbr><br>Det kan tage lidt tid</div>


Stort set det samme som du skriver i din seneste besked :o)
Det virker, men jeg ved ikke om det virker i andre browsere end IE.
Du må meget gerne kommentere min løsning :o)
Avatar billede roenving Novice
09. april 2006 - 12:19 #14
document.layers-tingen er til NS4.xx og er såvidt jeg kan se helt lovlig og korrekt !-)

-- noget andet er så om den overhovedet kommer til at blive brugt, for dem kan der ikke være mange tilbage af !o]
Avatar billede mclemens Nybegynder
09. april 2006 - 12:21 #15
function vent() {
    showHideSels('hidden'); // skjuler alle <select>
/* Kan ikke se funktionen showHideSels */

    getObjS().display = "block";
/* Sender en request ned til getObjS og siger retursvaret skal vises */

}
function getObjS() {
    if (document.getElementById)
        return document.getElementById("ventvenligst").style;
    else if (document.all)
        return document.all.ventvenligst.style;
    else if (document.layers)
        return document.ventvenligst; // denne er vist ikke korrekt, vel???
/* Kender desværre ikke ovenstående */
}



OT: De fleste browsere der bruges af folk idag understøtter getElementById så hvis man vil have et kort script der også fungerer i FF (det gør dit også) så:

function vent() {
    showHideSels('hidden'); // skjuler alle <select>
    document.getElementById("ventvenligst").style.display = "block"; //Viser beskeden
}

- Det er selvfølgelig en god ide at have seperate functioner der kan returnere en forudsat fast variabel baseret på hvad der er tilgængelig... Dog synes jeg du skal overveje ovenstående og glemme function getObjS() medmindre den skal indeholde mere end den gør her - eller være mere dynamisk til returnering af andre variabler baseret på hvad man trykker på ;)

mvh. Clemme
Avatar billede mclemens Nybegynder
09. april 2006 - 12:23 #16
[ document.layers-tingen er til NS4.xx og er såvidt jeg kan se helt lovlig og korrekt !-) ]
- Ok, så ved jeg det også :)

[ -- noget andet er så om den overhovedet kommer til at blive brugt, for dem kan der ikke være mange tilbage af !o] ]
- hehe... Ja, det er ikke helt sikkert ;)
Avatar billede learner Praktikant
09. april 2006 - 12:44 #17
men i mener at div'en vises korrekt(fuld skærm) i de fleste browsere, korrekt?
<div id="ventvenligst" style="z-index:1001;position:absolute;left:0px;top:0px;margin:0px;width:100%;height:100%;font-size:25px;color:red;background-color:white;display:none;text-align:center;"><strong><br><br><br><br><br>Vent venligts</strong><br><br>Din profil er ved at blive opdateretbr><br>Det kan tage lidt tid</div>
Avatar billede learner Praktikant
09. april 2006 - 12:50 #18
Håber på svar på det tidligere spm...

og

Okay, jeg bruger denne så:
function vent() {
    showHideSels('hidden'); // skjuler alle <select>
    document.getElementById("ventvenligst").style.display = "block"; //Viser beskeden
}

og her er den der mangler :) (just in case andre skulle bruge det også)
function showHideSels(action){
  sels = document.getElementsByTagName('SELECT');
  for(i=0;sels.length>i;i++)sels[i].style.visibility = action;
}

Alt okay?

Så har jeg blot et problem tilbage nu: http://www.eksperten.dk/spm/701657
Avatar billede mclemens Nybegynder
09. april 2006 - 12:56 #19
Her så er højden 100% ;)


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<script type="text/javascript">
<!--



function vent() {
    ty=(document.all) ? document.body.clientHeight : window.innerHeight;
    showHideSels('hidden'); // skjuler alle <select>
    document.getElementById("ventvenligst").style.height = ty+"px";
    document.getElementById("ventvenligst").style.display = "block";
}

function showHideSels(action){
  sels = document.getElementsByTagName('SELECT');
  for(i=0;sels.length>i;i++)sels[i].style.visibility = action;
}

//-->
</script>

</head>

<body>
<br><br><br>

<input name="blabla" type="submit" value="Send" onClick="vent();">

<div id="ventvenligst" style="z-index:1001;position:absolute;left:0px;top:0px;margin:0px;width:100%;height:100%;font-size:25px;color:red;background-color:white;display:none;text-align:center;"><strong><br><br><br><br><br>Vent venligts</strong><br><br>Din profil er ved at blive opdateretbr><br>Det kan tage lidt tid</div>

</body></html>
Avatar billede learner Praktikant
09. april 2006 - 13:08 #20
Kanon :) tænkte nok der var noget som kunne blive bedre...
Men du har ikke ændret i div'en vel?

Mange tusind tak for altsammen :o)
Avatar billede mclemens Nybegynder
09. april 2006 - 14:00 #21
Men du har ikke ændret i div'en vel?
Niks... :)

Mange tusind tak for altsammen :o)
- det var så lidt, har lagt et svar ;)
Avatar billede learner Praktikant
09. april 2006 - 14:31 #22
Skønt at det blev så enkelt.. Elsker enkle løsninger :o)
Avatar billede mclemens Nybegynder
09. april 2006 - 17:28 #23
- og takker for point :)
Avatar billede learner Praktikant
10. april 2006 - 10:51 #24
Øhh jeg har lige et tillægsspørgsmål :o)
hvis man scroller ned på siden og trykker på submitknap i bunden af siden, så kommer div'en frem, men den er placeret i toppen af siden... Hvad kan jeg gøre, så div'en altid er placeret i sysnfeltet? Kunne forestille mig at jeg skal tilføje noget i div'ens style=""

:o)
Avatar billede mclemens Nybegynder
10. april 2006 - 13:21 #25
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<script type="text/javascript">
<!--

function vent() {
    tt=(tmenu=document.documentElement.scrollTop)?tmenu:document.body.scrollTop;
    ty=(document.all) ? document.body.clientHeight : window.innerHeight;
    showHideSels('hidden'); // skjuler alle <select>
    ventv=document.getElementById("ventvenligst");
    ventv.style.height = ty+"px";
    ventv.style.display = "block";
    ventv.style.top=tt;
    document.documentElement.style.overflow="hidden";
}

function showHideSels(action){
  sels = document.getElementsByTagName('SELECT');
  for(i=0;sels.length>i;i++)sels[i].style.visibility = action;
}

//-->
</script>

</head>

<body>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>

<input name="blabla" type="submit" value="Send" onClick="vent();">

<div id="ventvenligst" style="z-index:1001;position:absolute;left:0px;top:0px;margin:0px;width:100%;height:100%;font-size:25px;color:red;background-color:white;display:none;text-align:center;"><strong><br><br><br><br><br>Vent venligts</strong><br><br>Din profil er ved at blive opdateretbr><br>Det kan tage lidt tid</div>

</body></html>
Avatar billede learner Praktikant
10. april 2006 - 15:15 #26
Tak :) det virker som det skal :)
Avatar billede mclemens Nybegynder
10. april 2006 - 17:03 #27
super ;)
Avatar billede learner Praktikant
12. april 2006 - 15:30 #28
tillægsspørgsmål se her:
http://www.eksperten.dk/spm/702420

På forhånd tak
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel Indlæg Oprettet Seneste aktivitet
problem med download i <a href=" " download> tag i JavaScript Af Peer i JavaScript 5 27/04/202620:09 03/05/202613:59
Validering af filnavn i formular Af Strawberry i JavaScript 8 14/04/202610:11 20/04/202611:14
Mangler et JavaScript til htm side med iframe i Joomla5 Af Peder Lund Nielsen i JavaScript 2 03/02/202614:19 04/04/202616:02
Åbne en PDF fil fra en mappe Af mbl i JavaScript 9 18/04/202516:52 22/04/202512:33
Spørgsmål til cookies Af Mads i JavaScript 2 14/02/202511:47 27/06/202514:34
Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I dag 09:37 hvilken AI synes I er bedst? Af jcr18 i Andre onlineløsninger
I går 18:51 Pausepil på youtube i chrome Af valby i Browsere
I går 11:42 Mail med endelsen ".lat" Af ErikHg i E-mail
21/0511:48 Nyåbnede sider flimrer på Android tablet, hvorfor Af annam i Andet software
21/0511:03 Bitlocker fordele-ulemper, samt nulstille PC Af Uvanga i Windows
White papers
Flere white papers »