Imbricarea la nesfârşit <div> Tag-uri şi jQuery

Acest lucru pare a fi un astfel de subiect de aiurit, Nu sunt sigur că merită cu adevărat blogging-ul despre, dar că niciodată nu a oprit mine înainte, Deci, aici vom merge Zâmbet

Am de lucru un proiect în cazul în care eu sunt trăgând unele date dintr-o căutare, ambalare-l într-un mesaj XML şi apoi că XML este transformat în cele din urmă în HTML prin intermediul XSLT.  Există o mulţime de jQuery implicate, un pic de care implementeaza anumite funcţionalităţi tabbing.  Când faceţi clic pe o filă (chiar, o <div>), jQuery invocă .hide() şi .show() pe diverse divs (pagină iniţială de încărcare descărcări toate conţinut, astfel încât nu există nici o postback în acest caz).

O grămadă de ore în urmă, fila logica de comutare a început să se comporte haotic şi aceasta nu s-ar arăta unul de meu file.  Am în cele din urmă urmărite l până la faptul că internet explorer (cel puțin) crezut că <div> Tag-uri imbricate departe, mult mai profunde decât destinate.Bara de instrumente producător ar arăta:

-<div id = "Tab1Content">
  -<div>
    -<div>
      -<div id = "Tab2Content">
        -<div>
           …………………………
                   </div>  <— în cele din urmă arătând că a fost închis tot drumul în jos aici!

Deci, dacă am făcut-o $("#Tab1Content").ascunde(), Am, de asemenea, s-ar ascunde Fila2 şi ar putea arăta niciodată Fila2 dacă nu arăt, de asemenea, Fila1.  Am copiat şi inserat codul în visual studio şi ea a arătat toate div garnitură până frumos, la fel ca ei ar fi trebuit să faci, în căutarea de genul asta:

-<div id = "Tab1Content">
  +<div>
  +<div>
-<div id = "Tab2Content">
  +<div>
  +<div>

Am batut capul meu de perete pentru un timp şi am observat că în real HTML codul a fost generatoare de o mulţime de gol <div> Tag-uri, ca:

<corpul>

  <div id = "Tab1Content">

    <div id = "row1" />
    <div id = "rînd2" />

  </div>

  <div id = "Tab2Content">

    <div id = "row1" />
    <div id = "rînd2" />

  </div>

</corpul>

(De mai sus este waaaaaaaaaaaay simplificat.  Gol div Tag-uri sunt complet valide. Unele dintre meu <div> Tag-uri au fost plin de conţinut, dar mult mai multe nu au fost.  Am venit la realizarea că meu <XSL:pentru fiecare> Directivele au fost emit scurt-forma div Tag-uri atunci când xsl:nu pentru fiecare "găseşte orice date.  Am forţat un comentariu HTML în ieşire, ca:

image

 

După ce am făcut-o, div aliniat frumos şi fila mea de comutare a început să lucreze.

Ca întotdeauna, Sper că acest lucru ajută pe cineva într-o priză.

</scop>

Aboneaza-te la blog-ul meu.

Urmaţi-mă pe Twitter, la http://www.twitter.com/pagalvin

lasă un răspuns

Adresa ta de email nu va fi publicată. Câmpurile obligatorii sunt marcate *