¿Por qué este selector de jquery no funciona?

Question

Tengo una tarea de un cliente para corregir una página y descubrí que el selector de descendientes jQuery no se comporta como se esperaba.

Aquí es un excrept del HTML:

<form action="http://submit.url/subscribe.php" method="post" enctype="multipart/form-data" id="mssysform8217" class="mssysform" > 
<div id="mssys-formcontainer"> 
    <div class="formfields"> 
     <table style="width: 100%"> 
     <div class="formfield-item" id="formfield-item-email"> 
      <tr> 
      <td class="style1"><label >E-mail címe</label></td> 
      <td> 
       <input type="text" name="email" value=""> 
       <div class="error-container">Please fill in this field!</div> 
       <div style="clear: both;"></div> 
      </td> 
      </tr> 
     </div> 
     </table> 
    </div> 
</div> 
</form> 

Traté de depurarlo con FireFox:

• esto funcionó:

  console.debug($("#mssysform8217 :input[name='email']").val()); 
  

  test@gmail.com

• esto no funcionó:

  console.debug($("#mssysform8217 #formfield-item-email :input[name='email']").val()); 
  

  indefinido

• pero:

  console.debug($("#mssysform8217 #formfield-item-email")); 
  

  [ítems email.formfield-formfield-elemento div #]

El problema es que el script de envío es generado por una aplicación de terceros y quiere usar el selector de descendientes de 3 niveles.

Answer 1

El selector jQuery que está intentando utilizar no funcionará porque el HTML no es válido.

<table style="width: 100%"> 
     <div class="formfield-item" id="formfield-item-email"> 
      <tr> 

Esto no es HTML válido. No es válido colocar un div (o cualquier elemento que no sea <thead>, <tfoot>, <tbody>, <tr>) en el medio de una tabla fuera de una celda.

Esto es válido:

<div> 
    <table> 
    <tr><td></td></tr> 
    </table> 
</div> 

O esto es válido:

<table> 
    <tr><td><div></div></td></tr> 
</table> 

---

En una nota: Está utilizando la tabla para dar formato a su formulario . Las tablas están destinadas a datos tabulares. Usar tablas para el diseño es una mala idea en mi libro. Use la semántica adecuada para los elementos HTML (tablas = datos tabulares, li = listas, div = divisiones de página, etc ...).