JQuery


Πρόκειται για μία συλλογή (βιβλιοθήκη) από συναρτήσεις Javascript που κάνει τον προγραμματισμό πιό γρήγηρο και εύκολο.

Μπορούμε είτε να κατεβάσουμε την jQuery και να την αποθηκεύσουμε μαζί με τις ιστοσελίδες μας είτε να βάλουμε σε κάθε ιστοσελίδα έναν σύνδεσμο για να ξέρει ο browser από που να την κατεβάσει. Η δεύτερη μέθοδος έχει περισσότερα πλεονεκτήματα.

Από τον ιστοχώρο jQuery.com μπορούμε να κατεβάσουμε δύο εκδόσεις:

  • Production version – (σε συμπιεσμένη μορφή)
  • Development version – (σε αυτή την έκδοση φαίνεται ο κώδικας από όλες τις συναρτήσεις)
Εναλλακτικά μπορούμε να βάλουμε έναν σύνδεσμο σε ιστοχώρο που φιλοξενεί το αρχείο jQuery. Τόσο η Google όσο και η Microsoft  παρέχουν αυτή την υπηρεσία.
 

Η μορφή μιας εντολής jQuery είναι: $(αυτόΠουΘαΜεταβάλουμε).ενέργεια(). Το σύμβολο $ υποδηλώνει πως οτι ακολουθεί σχετίζεται με jQuery. Παραδείγματα:

  • $(this).hide() – Κάνει απόκρυψη του html στοιχείου στο οποίο βρίσκεται.
  • $(«p»).hide() – Κάνει απόκρυψη όλων των παραγράφων.
  • $(«.προσωπικά»).hide() – Κάνει απόκρυψη όλων των στοιχείων που ανήκουν στην class με όνομα προσωπικά.
  • $(«#κινητό»).hide() – Κάνει απόκρυψη όλων των στοιχείων που έχουν id  κινητό.

 

Events (συμβάντα) είναι οτιδήποτε συμβαίνει σε μία ιστοσελίδα. Με την JQuery είναι εύκολο να ορίσουμε τι θέλουμε να συμβεί κάθε φορά που έχουμε ένα συμβάν. Τα πιο συνηθισμένα συμβάντα είναι :

Συμβάντα ολόκληρης ιστοσελίδας/ παράθυρου: ready, resize, scroll

Συμβάντα ποντικιού: clickdblclickmouseentermouseleave, mousedown, mouseup, hover

Συμβάντα πληκτρολογίου:  keydown (όση ώρα το πλήκτρο κατεβαίνει), keypress (όταν το πλήκτρο πατηθεί), keyup

Συμβάντα φόρμας: submitchangefocusblur

 

ready

Σχεδόν πάντα ο κώδικας jQuery θέλουμε να εκτελεστεί αφότου φορτωθεί η ιστοσελίδα γιαυτό και τον γράφουμε σε συνάρτηση που εκτελείτε όταν η σελίδα είναι έτοιμη:

ή εναλλακτικά

resize (παράδειγμα)

scroll (παράδειγμα)

click

dblclick (παράδειγμα)

mouseenter (παράδειγμα)

mouseleave (παράδειγμα)

mousedown (παράδειγμα)

mouseup (παράδειγμα)

hover (παράδειγμα)

Είναι συνδυασμός των mouseenter και mouseleave. Δέχεται δύο συναρτήσεις: η πρώτη εκτελείται όταν ο χρήστης εισέλθει με το ποντίκι και η δεύτερη όταν φύγει.

keydown και keyup (παράδειγμα)

keypress (παράδειγμα)

submit (παράδειγμα)

change (παράδειγμα)

focus (παράδειγμα)

blur (παράδειγμα)