Πώς να κάνετε επιλέξιμα στοιχεία στο AJAX για HTML5 και CSS3 Προγραμματισμός

Μπορεί να έχετε μια κατάσταση όπου θέλετε ο χρήστης να επιλέξει από μια λίστα στοιχείων. Το AJAX επιτρέπει στους προγραμματιστές HTML5 και CSS3 αυτή την επιλογή. Το επιλεγμένο widget είναι ένας πολύ καλός τρόπος για να δημιουργήσετε αυτή τη λειτουργία από μια συνηθισμένη λίστα. Ο χρήστης μπορεί να σύρει ή να πατήσει Ctrl + κλικ για να τα επιλέξει. Ειδικές κατηγορίες CSS εφαρμόζονται αυτόματα για να υποδηλώνουν ότι το στοιχείο εξετάζεται για επιλογή ή επιλογή.

Ακολουθήστε αυτά τα βήματα για να κάνετε ένα στοιχείο που μπορείτε να επιλέξετε:

1. Ξεκινήστε με μια λίστα με μη ταξινομημένες εντολές.

   Δημιουργήστε μια τυπική μη ταξινομημένη λίστα στο HTML σας. Δώστε το αναγνωριστικό ul έτσι ώστε να μπορεί να αναγνωριστεί ως κόμβος jQuery:

   
   επιλέξιμο
   
   alpha
   βήτα
   γάμμα
   δέλτα
   
   
   
   
   
   
   
   
   

2. Προσθήκη τάξεων CSS για επιλογή και επιλεγμένες καταστάσεις.

   Εάν θέλετε τα επιλεγμένα αντικείμενα να αλλάξουν εμφάνιση όταν τα αντικείμενα επιλέγονται ή έχουν επιλεγεί, προσθέστε τις κλάσεις CSS όπως φαίνεται. Ορισμένες ειδικές κλάσεις (ui-selecting και ui-selected) είναι προκαθορισμένες και θα προστεθούν στα στοιχεία στις κατάλληλες ώρες:

   h1 {text-align: center;} # selectable. ui-επιλογή {background-color: gray}} # επιλέξιμη. ui-επιλεγμένο {φόντο-χρώμα: μαύρο; χρώμα: λευκό,}
   

3. Στη λειτουργία init () , καθορίστε τη λίστα ως επιλέξιμο κόμβο.

   Χρησιμοποιήστε την τυπική σύνταξη jQuery: επιλέξιμη ().

   $ ("# selectable"). επιλέξιμο ();
   

Η κλάση επισυνάπτεται σε όλα τα στοιχεία όταν έχουν επιλεγεί. Βεβαιωθείτε ότι έχετε προσθέσει κάποιο είδος CSS σε αυτή την τάξη ή ότι δεν θα μπορείτε να πείτε ότι έχουν επιλεγεί τα στοιχεία.

Εάν θέλετε να κάνετε κάτι με όλα τα στοιχεία που έχουν επιλεγεί, απλά δημιουργήστε μια ομάδα στοιχείων jQuery με την ui-επιλεγμένη κατηγορία:

var selectedItems = $ (". Ui-selected");