WN

WN (https://www.wn.se/forum/index.php)
-   Klientsidans teknologier, design och grafik (https://www.wn.se/forum/forumdisplay.php?f=12)
-   -   Javascript: Egen alert, confirm och prompt... (https://www.wn.se/forum/showthread.php?t=34343)

oddholst 2009-01-09 01:40

I en del applikationer vill man ha uppgifter från användaren som helt enkelt kräver ett svar, och då kan man använda confirm eller prompt.

Det fungerar ju ungefär så här:

Kod:

...
var sSvar = prompt("Hur många kaffekoppar dricker du per dag?");
...

Nu har man ju fått ett värde från prompten. Enkelt gjort. Men om man vill göra en egen "prompt" som ser ut som man själv vill så kan man göra så här:

Kod:

function fMinPrompt(sFraga, sFunktionVidSvar, sFunktionVidAvbryt)
{
  // Kod som ritar upp en dialogruta som anropar en funktion vid svar
}

Kod för att sälla frågan:
Kod:

fMinPrompt("Hur många kaffekoppar dricker du per dag?","fPromptSvar","fPromptAvbryt");

function fPromptSvar(sSvar)
{
  // Kod för vidarebehandling av svar
}

function fPromptAvbryt()
{
  // Kod för vidarebehandling om användaren avbröt frågerutan
}

Alternativet är att skriva funktionskod (eller vad det nu kallas för) direkt vid anropet av prompten men det är ju lika komplicerat.

Så min fråga är nu om det finns någon möjlighet att anropa en egengjord prompt på samma sätt som man gör när man vill anlita den inbyggda prompten?

Syke 2009-01-09 08:18

Du kan inte påverka windows standardutseende om det är det du frågar. Inte med JS. Däremot kan du ju göra en prompt i HTML som ploppar upp på hemsidan.

oddholst 2009-01-09 10:27

Citat:

Originally posted by Syke@Jan 9 2009, 09:18
Du kan inte påverka windows standardutseende om det är det du frågar. Inte med JS. Däremot kan du ju göra en prompt i HTML som ploppar upp på hemsidan.

Nej, det är inte det jag frågar. Jag frågar om man kan anropa en egen prompt (i html eller vad man nu vill i javascript) med samma enkla förfarande som den inbyggda promptfunktionen.

Exempelvis
var sSvar = fMinPrompt("Skostorlek");

thorsell 2009-01-09 11:21

Ja, men jQuery kan du göra en "egen" prompt, se exempel:

http://trentrichardson.com/Impromptu/index.php

martine 2009-01-09 11:31

Citat:

Originally posted by oddholst@Jan 9 2009, 11:27
Nej, det är inte det jag frågar. Jag frågar om man kan anropa en egen prompt (i html eller vad man nu vill i javascript) med samma enkla förfarande som den inbyggda promptfunktionen.

Exempelvis
var sSvar = fMinPrompt("Skostorlek");

Ja, det är väl inget problem? Jag förstår inte riktigt vad det är du menar inte skulle gå, det är väl bara att skriva en funktion som returnerar värdet du vill ha…?

PS JQuery är inte nödvändigt för detta, men kanske kan vara enklare om du inte riktigt förstår hur js fungerar.

Onkelborg 2009-01-09 15:03

Nej, man kan inte göra det du efterfrågar. Ditt krav är att funktionen ska vänta med att returnera innan man svarat på frågan, och det går inte att göra så. Att det fungerar för den inbyggda prompt-funktionen är för att den är konstruerad så, men det går inte att bygga en egen med bara javascript. Att ha callback-funktioner är sättet man måste lösa på.

(Btw, jag tycker inte riktigt att ditt anrop är så lyckat, dels för att du deklarerar publika funktioner för svaren, och dels att du istället för pekare till funktionerna skickar med namnen på dem)

oddholst 2009-01-09 23:04

Ok. Då har jag fått svar på frågan. Det var som jag misstänkte.

Onkeborg: Ge gärna exempel. Jag vill lära mig!

Onkelborg 2009-01-09 23:36

Rent generellt:

När du deklarerar en funktion:
function foo()
{
alert('kaka');
}

så är det bara en kortform av:
var foo = function()
{
alert('kaka');
}

Grejjen är alltså att du deklarerar en variabel innehållandes en pekare till en funktion. Du skulle alltså senare i koden kunna skriva:
var bar = foo;
för att på så sätt låta även variabeln bar peka på samma funktion.

Med det i bagaget så går vi vidare:

Om vi har följande funktioner:
var foo = function()
{
alert('kaka');
}
var anrop = function(funk)
{
//här gör vi någonting spännande som tar ett tag, t.ex. ett AJAX-anrop
//nu är det dags att anropa vår funktion "funk":
funk(); //funk == referens till funktionen, funk() == exekvera funktionen och få resultatet av den
}

Vi vill nu anropa funktionen "anrop" med funktionen "foo" som argument:
anrop(foo);

Om vi vill slippa att deklarera funktionen "foo" så kan man dock skippa det steget genom att sätta själva funktionsdeklarationen som argument istället för en variabel som innehåller funktionen:
var anrop = function(funk)
{
//här gör vi någonting spännande som tar ett tag, t.ex. ett AJAX-anrop
//nu är det dags att anropa vår funktion "funk":
funk();
}
anrop(function() //det här är alltså anropet
{
alert('kaka');
});

Det finns många saker som är bra med det här, men som exempel så skulle jag kunna ta den kod du skrev ifrån början här i tråden:

fMinPrompt("Hur många kaffekoppar dricker du per dag?",
function(sSvar)
{
// Kod för vidarebehandling av svar
},
function()
{
// Kod för vidarebehandling om användaren avbröt frågerutan
});

oddholst 2009-01-10 06:12

Citat:

Originally posted by Onkelborg@Jan 10 2009, 00:36
Rent generellt:

När du deklarerar en funktion:
function foo()
{
alert('kaka');
}

så är det bara en kortform av:
var foo = function()
{
alert('kaka');
}

Grejjen är alltså att du deklarerar en variabel innehållandes en pekare till en funktion. Du skulle alltså senare i koden kunna skriva:
var bar = foo;
för att på så sätt låta även variabeln bar peka på samma funktion.

Med det i bagaget så går vi vidare:

Om vi har följande funktioner:
var foo = function()
{
alert('kaka');
}
var anrop = function(funk)
{
//här gör vi någonting spännande som tar ett tag, t.ex. ett AJAX-anrop
//nu är det dags att anropa vår funktion "funk":
funk(); //funk == referens till funktionen, funk() == exekvera funktionen och få resultatet av den
}

Vi vill nu anropa funktionen "anrop" med funktionen "foo" som argument:
anrop(foo);

Om vi vill slippa att deklarera funktionen "foo" så kan man dock skippa det steget genom att sätta själva funktionsdeklarationen som argument istället för en variabel som innehåller funktionen:
var anrop = function(funk)
{
//här gör vi någonting spännande som tar ett tag, t.ex. ett AJAX-anrop
//nu är det dags att anropa vår funktion "funk":
funk();
}
anrop(function() //det här är alltså anropet
{
alert('kaka');
});

Det finns många saker som är bra med det här, men som exempel så skulle jag kunna ta den kod du skrev ifrån början här i tråden:

fMinPrompt("Hur många kaffekoppar dricker du per dag?",
function(sSvar)
{
// Kod för vidarebehandling av svar
},
function()
{
// Kod för vidarebehandling om användaren avbröt frågerutan
});

Jaha.. det där har jag ju sett tillämpas men inte tillämpat själv mer än vid vissa ajax-anrop. Jag skall använda det mer flitigt.

Tack för tipset.

Onkelborg 2009-01-10 11:52

Det är lite praktiskt också, jag ska visa ett enkelt exempel :)

function hanteraKlickPåKnapp(djurTyp)
{
//Ajax-kod
ajax.onSidanLaddad = function()
{
alert(djurTyp); //Här kan jag använda variabeln djurTyp, trots att den inte är medskickad som parameter till just den här funktionen. Den ärver alltså variablerna från contextet ovanför
};
};

Som du ser i mitt lilla exempel så kan du alltså få tillgång till variabler från contextet ovanför dig (som i sin tur ärver från contextet ovanför sig, osv), vilket gör att du slipper göra flera publika funktioner, _och_ slippa göra en massa publika variabler/klasser/behöva skicka med en massa parametrar på något sätt. Istället kan man skriva all kod i en, enda publik funktion som om den vore synkron istället för asynkron. I exemplet så följer ju t.ex. "djurTyp" med automatiskt, men även "ajax" följer med, om man nu till exempel vill göra ännu ett nytt anrop mot servern :)


Alla tider är GMT +2. Klockan är nu 22:18.

Programvara från: vBulletin® Version 3.8.2
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.
Svensk översättning av: Anders Pettersson