Comment faire éléments sélectionnables en ajax pour HTML5 et CSS3 programmation

Vous pouvez avoir une situation où vous voulez que l'utilisateur de choisir parmi une liste d'éléments. AJAX permet HTML5 et CSS3 programmeurs cette option. La sélectionnable widget est un excellent moyen pour créer cette fonctionnalité à partir d'une liste ordinaire. L'utilisateur peut glisser ou Ctrl + cliquer sur les éléments pour les sélectionner. Classes CSS spéciales sont appliquées automatiquement pour indiquer que l'élément est pris en considération pour la sélection ou sélectionné.

image0.jpg

Suivez ces étapes pour faire un élément sélectionnable:

  1. Commencez avec une liste non ordonnée.

    Construire une liste non ordonnée standard dans votre code HTML. Donnez le ul un ID de sorte qu'il peut être identifié en tant que noeud jQuery:

     

    sélectionnable

    • alpha
    • bêta
    • gamma
    • delta



    • Ajouter des classes CSS pour sélectionner et états sélectionnés.

      Si vous voulez que les éléments sélectionnables pour modifier l'apparence lorsque les articles sont sélectionnés ou ont été sélectionnés, ajouter des classes CSS comme indiqué. Certaines classes spéciales (ui-sélection et ui-sélectionné) Sont prédéfinis et seront ajoutés à des éléments au moment approprié:

       
    • Dans le init () fonction, spécifiez la liste en tant que noeud sélectionnable.

      Utilisez la syntaxe jQuery norme: sélectionnable ().

       $ ("# sélectionnable") sélectionnable (). -

    La classe est fixé à tous les éléments quand ils ont été sélectionnés. Soyez sûr d'ajouter une sorte de CSS pour cette classe, ou vous ne serez pas en mesure de dire que les articles ont été sélectionnés.

    Si vous voulez faire quelque chose avec tous les éléments qui ont été sélectionnés, il suffit de créer un groupe d'éléments jQuery avec le ui-sélectionné classe:

    var selectedItems = $ ("ui-sélectionné.") -

    » » » » Comment faire éléments sélectionnables en ajax pour HTML5 et CSS3 programmation