/ Forside / Teknologi / Udvikling / Java Scripts / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
Java Scripts
#NavnPoint
molokyle 5410
Klaudi 2799
smorch 2439
kim 1360
Harlekin 1134
bentjuul 984
gibson 800
severino 695
Random 675
10  konsulent.. 626
jquery set onchange på alle felter
Fra : Leif Neland


Dato : 20-01-11 12:56

Kan dette gøres elegantere?

function setOnChange() {
for (var i=0; i<document.forms.length; i++)
{if (document.forms[i].length)
{for (var j=0; j<document.forms[i].length; j++)
   
{
   if(!(document.forms[i][j].onchange)) {
      document.forms[i][j].onchange = function ()
{haschanged(this.name);}
   }
}
}
}
}

Bruges til at sikre at brugeren ikke forlader en form, der er ændret i,
uden at gemme ændringerne.

 
 
Martin Larsen (20-01-2011)
Kommentar
Fra : Martin Larsen


Dato : 20-01-11 14:32

Leif Neland wrote:

> Kan dette gøres elegantere?

Nu spørger du jo direkte til jQuery, så ja:

$("#form input").change(function(){
haschanged(this.name);
})

Martin

Birger Sørensen (20-01-2011)
Kommentar
Fra : Birger Sørensen


Dato : 20-01-11 14:39

Martin Larsen forklarede:
> Leif Neland wrote:
>
>> Kan dette gøres elegantere?
>
> Nu spørger du jo direkte til jQuery, så ja:
>
> $("#form input").change(function(){
> haschanged(this.name);
> })
>
> Martin

Jeg har ikke begreb om JQuery.
Umiddelbart vil dit forslag sætte onchange på alle input elementer?
Altså også button, submit, reset, image - og evt. andre typer input,
hvor det ikke giver mening?
Mangler i øvrigt SELECT - det gør mit eget forslag også...

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Birger Sørensen (20-01-2011)
Kommentar
Fra : Birger Sørensen


Dato : 20-01-11 17:45

Birger Sørensen forklarede:
> Martin Larsen forklarede:
>> Leif Neland wrote:
>>
>>> Kan dette gøres elegantere?
>>
>> Nu spørger du jo direkte til jQuery, så ja:
>>
>> $("#form input").change(function(){
>> haschanged(this.name);
>> })
>>
>> Martin
>
> Jeg har ikke begreb om JQuery.
> Umiddelbart vil dit forslag sætte onchange på alle input elementer?
> Altså også button, submit, reset, image - og evt. andre typer input, hvor det
> ikke giver mening?
> Mangler i øvrigt SELECT - det gør mit eget forslag også...
>
> Birger

Mangler i øvrigt også textarea...

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Martin Larsen (20-01-2011)
Kommentar
Fra : Martin Larsen


Dato : 20-01-11 20:37

Birger Sørensen wrote:

> Jeg har ikke begreb om JQuery.

Du ville nu blive rigtig glad for at stifte bekendtskab med det. Seriøst!

> Umiddelbart vil dit forslag sætte onchange på alle input elementer?
> Altså også button, submit, reset, image - og evt. andre typer input, hvor det ikke giver mening?
> Mangler i øvrigt SELECT - det gør mit eget forslag også...

Ja, det var bare ment som et skelet til at bygge lidt videre på.

Men jQuery er dejligt koncist, så her får du det hele:

$("input:text,textarea,select").change(function(){
haschanged(this.name);
})

Det laver onchange på tekst-input, select og textarea.

Martin

Martin (22-01-2011)
Kommentar
Fra : Martin


Dato : 22-01-11 01:22

On 20-01-2011 20:36, Martin Larsen wrote:
> Birger Sørensen wrote:
>
>> Jeg har ikke begreb om JQuery.
>
> Du ville nu blive rigtig glad for at stifte bekendtskab med det. Seriøst!
>
>> Umiddelbart vil dit forslag sætte onchange på alle input elementer?
>> Altså også button, submit, reset, image - og evt. andre typer input,
>> hvor det ikke giver mening?
>> Mangler i øvrigt SELECT - det gør mit eget forslag også...
>
> Ja, det var bare ment som et skelet til at bygge lidt videre på.
>
> Men jQuery er dejligt koncist, så her får du det hele:
>
> $("input:text,textarea,select").change(function(){
> haschanged(this.name);
> })

Eller endnu nemmere
$(':input').change(function() {
haschanged(this.name);
});

:input = ALLE former for input felter, heriblandt også textarea select
og button

Martin Larsen (23-01-2011)
Kommentar
Fra : Martin Larsen


Dato : 23-01-11 01:03

Martin wrote:

> Eller endnu nemmere
> $(':input').change(function() {
> haschanged(this.name);
> });

Ja ... men Birger efterspurgte en løsning der IKKE involverede knapper,
submit, images osv - og det gør ovenstående!

Min løsning laver onchange på *tekst-input*, select og textarea.

Maritn

Martin (24-01-2011)
Kommentar
Fra : Martin


Dato : 24-01-11 18:32

On 23-01-2011 01:03, Martin Larsen wrote:
> Martin wrote:
>
>> Eller endnu nemmere
>> $(':input').change(function() {
>> haschanged(this.name);
>> });
>
> Ja ... men Birger efterspurgte en løsning der IKKE involverede knapper,
> submit, images osv - og det gør ovenstående!

Nå ja

$(':input').not('input[type="submit"]').not('button').change(function() {
haschanged(this.name);
});

Hehehe... ja jquery er sjovt, man kan altid finde på rigtig mange sjove
måder at skrive på :D

Birger Sørensen (24-01-2011)
Kommentar
Fra : Birger Sørensen


Dato : 24-01-11 19:38

Martin kom med følgende:
> On 23-01-2011 01:03, Martin Larsen wrote:
>> Martin wrote:
>>
>>> Eller endnu nemmere
>>> $(':input').change(function() {
>>> haschanged(this.name);
>>> });
>>
>> Ja ... men Birger efterspurgte en løsning der IKKE involverede knapper,
>> submit, images osv - og det gør ovenstående!
>
> Nå ja
>
> $(':input').not('input[type="submit"]').not('button').change(function() {
> haschanged(this.name);
> });
>
> Hehehe... ja jquery er sjovt, man kan altid finde på rigtig mange sjove måder
> at skrive på :D

$(':input').not('input[type="submit"]').not('input[type=button').not('input[type=image').change(function()
{
haschanged(this.name);
});

Vil jeg tro.
Mangler så stadig textarea og select.. ?
Faren er jo at man kommer til at glemme at programmere selv, og ender
med et 32K overflødigt overhead, for at lægge to tal sammen...
Sjovt er nok ikke det ord jeg ville bruge - men hver sine lyster...

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Martin Larsen (24-01-2011)
Kommentar
Fra : Martin Larsen


Dato : 24-01-11 20:38

Birger Sørensen wrote:

> Mangler så stadig textarea og select.. ?

I min version (som tidligere nævnt) er begge dele med:

$("input:text,textarea,select").change(function(){
haschanged(this.name);
})

> Faren er jo at man kommer til at glemme at programmere selv, og ender
> med et 32K overflødigt overhead, for at lægge to tal sammen...

Da OP spurge specifikt til jQuery, må vi antage at han allerede bruger
det så der dermed ikke er noget overhead.

Desuden er læsbarhed og programmeringstid også væsentligt; ovennævnte
løsning er både elegant og læsbar hvis man bare har arbejdet en smule
med jQuery.

Og hvis man får lyst til at inkludere andre elementer, sættes de bare
ind i rækken separeret med komma.

Martin

Birger Sørensen (20-01-2011)
Kommentar
Fra : Birger Sørensen


Dato : 20-01-11 14:33

Leif Neland forklarede:
> Kan dette gøres elegantere?
>
> function setOnChange() {
> for (var i=0; i<document.forms.length; i++)
> {if (document.forms[i].length)
> {for (var j=0; j<document.forms[i].length; j++)
>
> {
>    if(!(document.forms[i][j].onchange)) {
>       document.forms[i][j].onchange = function ()
> {haschanged(this.name);}
>    }
> }
> }
> }
> }
>
> Bruges til at sikre at brugeren ikke forlader en form, der er ændret i, uden
> at gemme ændringerne.

Det ser tilforladeligt ud. (Forstår ikke lige hvorfor Emnet nævner
JQuery - det er helt almindeligt JS... )

Jeg ikke sikker på, jeg ville bruge
function () { haschanged(this.name); }
men det kommer selvfølgelig an på funktionen haschanged() - umiddelbart
vi det være nemmere bare at bruge
function () { haschanged(this); }
det vil overføre elementet, ikke kun elementets navn. Og elementets nav
kan ikke umiddelbart bruges til ret meget (name er ikke unik som id er
det - og der er ikke en nem måde at finde elementet på.) Men hvis det
bare er til en alrt eller lignende, er det nok ligemeget.
(Hvis det overhovedet er rigtigt at bruge this der, og på den måde..?)

En anden tanke kan være at tekster, labels etc., der måtte stå i
formen(e), også vil få sat en onchange - og det accepterer de vist ikke
alle. Så en test på om det faktisk er et element, det giver mening at
have en onchange på, vil nok have en berettigelse.
F.eks.

var types = array( 'text', 'password', 'checkbox', 'radio', 'file');
if (( document.forms[i][j].tagName == 'INPUT') &&
( types.indexOf( document.forms[i][j].type) > -1))
indsat de rigtige steder, forstås...

Birger

--
http://varmeretter.dk - billig, sund og hurtig mad
http://bbsorensen.dk



Lasse Reichstein Nie~ (22-01-2011)
Kommentar
Fra : Lasse Reichstein Nie~


Dato : 22-01-11 10:20

Leif Neland <leif@neland.dk> writes:

> Kan dette gøres elegantere?
>
> function setOnChange() {
> for (var i=0; i<document.forms.length; i++)
> {if (document.forms[i].length)
> {for (var j=0; j<document.forms[i].length; j++)
>    
> {
>    if(!(document.forms[i][j].onchange)) {
>       document.forms[i][j].onchange = function ()
>       {haschanged(this.name);}
>    }
> }
> }
> }
> }
>
> Bruges til at sikre at brugeren ikke forlader en form, der er ændret
> i, uden at gemme ændringerne.

Jeg ser en masse gentagen kode. Hvad med at bruge nogle variable?
Der er ingen grund til at lave en ny funktion for hvert element der
skal have en onchange-handler, når alle funktionerne gør det samme
alligevel

function onchangeHandler(event) {
haschanged(this.name);
};
function setOnChange() {
var forms = document.forms;
for (var i = 0; i < forms.length; i++) {
var elems = forms[i].elements;
if (elems.length) {
for (var j = 0; j < elems.length; j++) {
var elem = elems[j];
if (!elem.onchange)
elem.onchange = onchangeHandle;
}
}
}
}
}

Du rammer kun de elementer der ikke allerede har en onchange-handler.
Det kan undgås i de fleste browsere ved at bruge:
if (typeof elem.addEventListener == "function") {
elem.addEventListener("change", onchangeHandler, true);
} else {
if (!elem.onchange) {
elem.onchange = onchangeHandler;
}
}

Ingen jQuery her, beklager.
/L
--
Lasse Reichstein Holst Nielsen
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

Leif Neland (22-01-2011)
Kommentar
Fra : Leif Neland


Dato : 22-01-11 15:29

Tak for inputs. Der mangler lige den krølle, at nogle felter har en
onchange allerede, og de skal ikke ændres.

> if(!(document.forms[i][j].onchange)) {
> document.forms[i][j].onchange = function ()
> {haschanged(this.name);}

--
Bevar P2, luk P3, der er nok P3'er i forvejen.

Martin Larsen (23-01-2011)
Kommentar
Fra : Martin Larsen


Dato : 23-01-11 01:19

Leif Neland wrote:

> Tak for inputs. Der mangler lige den krølle, at nogle felter har en
> onchange allerede, og de skal ikke ændres.

Kommer lidt an på hvad du mener med ovenstående. Hvis du bruger
jquery-metoden, vil der blot tilføjes endnu en event-handler, den gamle
vil således stadig virke fint.

Hvis du derimod slet ikke vil udføre haschanged, skal der blot tjekkes
om der i forvejen findes en onchange-handler.

Martin

Søg
Reklame
Statistik
Spørgsmål : 177552
Tips : 31968
Nyheder : 719565
Indlæg : 6408849
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste