Petits « trucs » actucieux en javaScript et jQuery

jQuery - Write less, do more - javaScript library
jQuery – Write less, do more
Obtenir la taille réelle d’une image :

On utilise les propriétés naturalWidth et naturalHeight de l’objet javascript :

 

Supprimer le 1er caractère si c’est un espace :

 

Détecter la présence d’un bloqueur :

On crée un fichier ads.js, vide ou avec une seule ligne :

ads.js :

Et lorsque l’on veut savoir si le bloqueur de pubs est activé ou pas:

 

Identique à la méthode $.contains, mais qui matche exactement le contenu:

$.exp[‘:’] permet de définir en outre le pseudo selecteur :.

 

Obtenir la liste des clés d’un objet JSON:

L’objet est de la forme:

On obtient la liste des clés avec la méthode keys de l’objet Object:

 

Rendre la méthode $.contains insensible à la casse:

$.exp[‘:’] permet de définir en outre le pseudo selecteur :.

 

Séparer les différentes lignes d’une chaine:

lines est un tableau constitué par les différentes lignes.

 

Ajouter un délai avant l’exécution d’une fonction sans l’exécuter si le délai est inférieur:

et pour appliquer la fonction, par exemple pour ne déclencher l’exécution d’un callback que si la souris survole un élément plus d’1 seconde :

 

Détecter l’évènement paste (coller) dans un input:

Il faut mettre un setTimeout très court pour que l’événement soit détecté:

 

La fonction php addslashes() en javaScript:

Une chaîne peut être échappée complètement et de façon compacte en utilisant JSON.stringify

 

Argument facultatif dans une fonction javaScript:

L’argument precision est optionnel, s’il n’est pas donné, il est initialisé à 2.

Obtenir une valeur au hasard d’un tableau:

Et pour obtenir un élément au hasard d’un ensemble d’éléments jQuery:

 

La fonction htmlentities pour javaScript:

 

Tester si la souris est au-dessus d’un élément:

 

Sélectionner des éléments dont le texte commence par quelque chose:

 

Obtenir la date courante au format SQL ou <input type= »date »> en javaScript:

date contient la date au format yyyy-mm-dd.

 

Changer un attribut de nom:

Cela peut être utile si l’on veut par exemple ne pas charger une image pour la montrer ultérieurement (par exemple dans une lightbox). On utilise l’attribut data pour entrer le chemin l’image et on le change en src pour charger l’image:

Code HTML:

On change donc l’attribut data en src, l’image est déjà chargée, elle est affichée instantanément.

Code jQuery:

Pour le faire sur toute une série d’images, on inclut cela dans une bouche each():

Sélectionner les éléments possédant l’attribut ‘name’:

Et pour tester si un élément possède l’attribut ‘name’:

 

Selectionner le premier enfant de l’objet $(this):

on sélectionne notre objet: notif= $(« #foo »);

Plusieurs possibilités plus ou moins rapides:

La propriété firstChild de l’objet javascript est encore un peu plus rapide:

 

Changer une balise, par exemple un <span> en <p>:

On utilise la fonction replaceWith():

 

width(), innerWidth(), outerWidth():
width, innerWidth, outerWidth
width, innerWidth, outerWidth
Appui sur la touche « entrée » ou « return »:

 

Valider un input avec la touche « entrée » ou « return »:

 

N’entrer que des nombres positifs dans les input de type « number ». On empêche l’appui sur les touches non numériques:

 

Avec jQueryUI, sélectionner tous les effets « easing », les placer dans une liste à options.

 

Fonction anonyme pour se préserver des interactions avec les autres librairies js utilisant le $:

 

Avec un document.ready, la même fonction:

 

Structure d’un plugin:

 

Options JSON dans un plugin:

 

Le plugin peut être appelé de la façon suivante, en ne spécifiant que quelques options:

 

Sélectionner les frères qui ne sont pas des images (par exemple):

 

Sélectionner l’élément frère précédent qui a la même classe:

Limiter le déclenchement de l’événement « resize » pour diminuer les recalculs:

 

Test sur le nombre d’éléments d’une certaine classe que contient une div:

 

Soumettre un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *