Maison >interface Web >js tutoriel >Méthode jQuery pour obtenir la valeur de couleur dans style_jquery

Méthode jQuery pour obtenir la valeur de couleur dans style_jquery

WBOY
WBOYoriginal
2016-05-16 16:17:151031parcourir

L'exemple de cet article décrit comment jQuery obtient la valeur de couleur dans le style. Partagez-le avec tout le monde pour votre référence. L'analyse spécifique est la suivante :

Lorsque j'ai utilisé jQuery pour obtenir la valeur de background-color dans le style aujourd'hui, j'ai découvert que la valeur de couleur obtenue dans IE est dans un format différent de celui affiché dans Chrome et Firefox, elle est affichée en HEX. format [#ffff00], tandis que dans Chrome, Firefox affiche [rgb(255,0,0)] au format GRB Puisque les valeurs de couleur doivent être stockées dans la base de données, nous souhaitons unifier le format des valeurs de couleur. ​​(en fait, ils peuvent être stockés s'ils ne sont pas unifiés). Après recherche, j'ai obtenu un morceau de code provenant d'un site Web étranger :

$.fn.getHexBackgroundColor = function() {
 var rgb = $(this).css('background-color');
 rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
 function hex(x) {return ("0" + parseInt(x).toString(16)).slice(-2);}
 return rgb= "#" + hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]);
}

La définition ci-dessus est une fonction jQuery. Nous pouvons obtenir la valeur RVB de la couleur d'arrière-plan de la balise id="bg" via $("#bg").getHexBackgroundColor();.

Faisons une petite modification, c'est-à-dire ajoutons un jugement. S'il s'agit d'un navigateur IE, récupérez simplement la valeur directement. S'il s'agit d'un navigateur non-IE, convertissez la valeur au format RVB :
.

$.fn.getHexBackgroundColor = function() {
 var rgb = $(this).css('background-color');
 if(!$.browser.msie){
  rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
  function hex(x) {return ("0" + parseInt(x).toString(16)).slice(-2);}
  rgb= "#" + hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]);
 }
 return rgb;
}

J'espère que cet article sera utile à la programmation jQuery de chacun.

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn