jQuery

September 17, 2008

Javascript

GRYMMT! tänkte jag första gången jag provade jQuery biblioteket. Den är till extremt stor hjälp när du vill göra smidiga webbsidor, framför allt när du ska ha en modern webb 2.0 sida. jQuery används när du vill skapa dynamiskt innehåll, den kan komma åt alla html-element och göra i princip vad som helst med dem. Låt säga att du har en <p> tagg med css-klassen .neat som är dold. du vill sedan visa denna när du trycker på en knapp, enkelt! Då skriver du bara $(“p.neat”).addClass(“ohmy”).show(“slow”);
$(“p.neat”) skriver du för att komma åt p-taggen, sedan kan jQuery lägga till enn css-klass på denna med functionen addClass efter det vill vi tala om hur den ska visas. i detta fall är det show(“slow”); vilket gör att den kommer att förstoras upp från ingenting något sakta.

Eller som när jag knappade *censur*’s nya kampanjsida så ville jag endast tillåta vissa tecken på ett inputfält. Då såg det ut så här:

$(“[name=txtFullName]“).keyup(function(e) {
   c = $(this).val().replace(/[^A-Za-zåäöÅÄÖ\s]/g, ”);
   $(this).val(c);
})

Vilket betyder att på inputfältet där name är lika med txtFullName ska trigga en funktion när släpper en tangententryckning. $(this) hänvisar till det elementet som triggade funktionen, dvs inputrutan. val() plockar värdet. Och på värdet ersätter jag allt som inte är A-Z, a-z, åäöÅÄÖ eller mellanslag till ingenting.
sedan sätter jag värdet på inputrutan med hjälp av $(this).val(c);

Inte mycket svårare än flash motsvarighet till restrict!
Knappa dig in på sidan nedan för att se exempel.

jQuery: http://www.jquery.com