IE8 Mode standard JQuery illogic

Question

J'ai un problème JQuery (en utilisant JQuery 1.4.2) qui n'apparaît que dans IE8 en mode standard, sur un élément DOM spécifique mais pas sur d'autres domaines presque identiques. Le meilleur exemple de la raison pour laquelle il n'a pas de sens est ci-dessous:

$('span.error:visible')[0].style.display 

La pièce ci-dessus renvoie le code « none » qui, à moins que j'ai une sorte de anévrysmes du cerveau est impossible sans qu'il y ait un bug dans les deux JQuery ou IE8 . Cela se produit uniquement dans IE8 en mode standard, pas dans un autre navigateur ou en mode de compatibilité IE8. L'étendue qu'il trouve est en fait un contrôle de validation ASP.net, donc je n'ai qu'une quantité limitée si le contrôle de ce qu'il rend au navigateur. Quand j'inspecte le DOM en utilisant la barre d'outils développeur IE8 et copier le code HTML du DOM, il me donne le ci-dessous:

<SPAN style="DISPLAY: none; COLOR: red" 
id=ctl00_cphContentBody_mnMainMiddleNames_ebvMiddleName1 class=error 
controltovalidate="ctl00_cphContentBody_mnMainMiddleNames_txtMiddleName0" 
errormessage="JQuery should not find this" display="Dynamic" validationGroup="MiddleNames" 
isvalid="true" validationexpression="[A-Za-z][A-Za-z '\-]*[A-Za-z]*">JQuery should not 
find this</SPAN> 

Si je fais juste une source de vue et copier et la coller je reçois le ci-dessous:

<span id="ctl00_cphContentBody_mnMainMiddleNames_ebvMiddleName1" class="error" 
style="color:Red;display:none;">JQuery should not find this</span> 

Si je crée un simple fichier HTML contenant uniquement l'un des deux éléments ci-dessus de HTML alors $('span.error:visible') ne trouve pas les travées et je suis incapable de publier du code pour être en mesure de reproduire ce problème. Mais dans la page asp.net réelle si je cours $('span.error:visible')[0].style.display il renvoie "aucun" et si je cours $('span.error:visible').text() il renvoie "JQuery ne devrait pas trouver ceci". Comment $('span.error:visible')[0].style.display peut-il retourner «aucun».

Editer pour répondre Nicks comment.

$('span.error:visible')[0].offsetWidth 3 retours $('span.error:visible')[0].offsetHeight retours 22

Ce qui laisse perplexe, je trouve le ci-dessous sur le site Jquery.

In jQuery 1.3.2 an element is visible if its browser-reported offsetWidth or offsetHeight is greater than 0.

L'élément n'est pas visible, mais selon les indications de JQuery ci-dessus.

What does this change mean? It means that if your element's CSS display is "none", or any of its parent/ancestor element's display is "none", or if the element's width is 0 and the element's height is 0 then an element will be reported as hidden.

Donc, ce qui précède est faux. L'affichage est "none" mais offsetWidth et offsetHeight ne sont pas nuls.

Answer 1

Cela semble être un bug de navigateur, mais si jQuery devrait le gérer est certainement un sujet de débat. Le :visible selector est vraiment juste un revers :hidden selector et il y a vérifier si l'élément a un 0 pour offsetHeight et offsetWidth (par exemple caché étant défini comme étant « en utilisant pas d'espace dans la page ».

IE ne devrait pas permettre display: none d'avoir .? un offsetWidth et offsetHeight, de sorte que la racine du problème est là devrait jQuery ajouter le traitement de cette manière peut-être, il y a déjà un bug qui peut être déposé exactement votre problème here

Answer 2

Je me demande si cela est quelque chose à voir avec visible vs cachée:

visibilité: caché cache l'élément, mais il faut encore l'espace dans la mise en page.

Afficher: aucun supprime complètement l'élément du document. Il ne prend pas d'espace, même si le code HTML est toujours dans le code source.

(de http://webdesign.about.com/od/css/f/blfaqhidden.htm)

Wwhat procédez comme suit ?: vous donnez

$('span.error:not(:hidden')[0].style.display 

Et

$('span.error:visible')[0].style.visibility 

Vous pouvez aussi regarder au CSS plus en détail à l'aide du développeur IE8 Outils (F12).