web-dev-qa-db-fra.com

jquery .css ("border-color") ne renvoie rien

J'ai écrit le javascript jquery suivant

$(document).mousemove(function(event) {
    var element = event.target;
    $(element).css("border","black solid 1px");
});

$(document).mouseout(function(event) {
    var element = event.target;
    console.log( "1 = "$(element).css("border-color") )
    $(element).css("border","0px");
    console.log( "2 = " + $(element).css("border-color") )
});

Fondamentalement, il dessine un cadre autour d'un élément survolé. Lorsque vous exécutez ceci en chrome, la sortie de console.log( "1 = "$(element).css("border-color") ) est "" c’est-à-dire rien. Il en va de même pour console.log( "2 = "$(element).css("border-color") ). Mais je m'attendrais au noir. J'ai aussi essayé borderColor qui ne marche pas non plus. 

Quoi qu’il en soit, lors du survol d’un élément, un cadre est tracé autour de cet élément, comme je l’attendrais. Pourquoi alors la sortie ne donne rien en retour?

jquerycssborder
12
toom

Vous ne pouvez pas utiliser un raccourci pour jQuery. Vous devez être plus précis, par exemple "border-top-color"

Faites-moi savoir si cela fonctionne.

19
Mike Depies

Utilisez jQuery (...). Css (“borderTopColor”) 

Cela fonctionne: http://jsfiddle.net/JvTwp/

11
simon
$("#mytext").focus(function () {

  $(this).css({'background-color': '#FFFFCC'});

  $(this).css("border", "black solid 1px"); 

}).blur(function () {

  $(this).css({'background-color': '#fff'});
  $(this).css("border", "#DCDCDC solid 1px");

 });


<input type="text" id="mytext">

Essaye ça

http://jsfiddle.net/prabirchoudhury/kcnT8/

8
Prabir Choudhhury

Avec l'aide d'un inspecteur, vous pouvez vérifier qu'il n'existe pas de propriété nommée 'border-color', vous cherchez 'border- [haut | bas | gauche | droite] -couleur'

3
dvd

Tant que vous définissez la couleur avec JavaScript/jQuery (comme dans je ne pense pas que cela fonctionnera si elle était uniquement définie en CSS). Je n'ai pas trouvé comment accéder à ces propriétés via jQuery, mais vous pouvez toujours accéder aux propriétés de la bordure à l'aide de JavaScript natif.

console.log(this.style.borderTop); // should return '1px solid rgb(0, 0, 0)'
console.log(this.style.borderColor); // should return 'rgb(0, 0, 0)'

Remarque:
.border (Top | Right | Bottom | Left) semble assez fiable, mais
.border (Style | Color | Width) donne des résultats mitigés. 

Je pense que cela dépend si les côtés sténographiques sont identiques; par exemple:

  • Tous les côtés de l'identicule
  • haut et bas (l'un avec l'autre)/gauche et droite (l'un avec l'autre)
  • en haut/à gauche et à droite (l'un avec l'autre)/en bas
  • Tous les quatre étant réglés différemment ne semble pas fonctionner
  • Je n'ai pas encore eu de succès avec juste element.style.border ensemble de bordures ensemble (c'est-à-dire element.style.border = '1px solid #000')
0
Gary