爲什麼這個jQuery選擇器不起作用？

我有一個來自客戶端的任務來糾正一個頁面，我發現jQuery後代選擇器的行爲並不像預期的那樣。爲什麼這個jQuery選擇器不起作用？

下面是HTML的excrept：

<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>

我試着用Firefox來調試它：

這工作：

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

[email protected]

這不工作：

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

不確定

但：

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

[DIV＃formfield項-email.formfield項]

問題提交腳本是由第三方應用程序生成的，它希望使用3級後代選擇器。

來源

2010-11-22 sipiatti

爲什麼使用多個ID選擇器（「#id」）？ – Homer 2010-11-22 21:41:10

而且似乎只有一個'`從＃formfield-item-email降序，所以[name]屬性選擇器是不必要的。 `$（'＃formfield-item-email input'）.val（）`應該是你所需要的。 – stevelove 2010-11-22 21:44:26

您嘗試使用的jQuery選擇器不起作用，因爲HTML無效。

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

這不是有效的HTML。將div（或除<thead>，<tfoot>,<tbody>,<tr>之外的任何元素）放置在單元格外的表格中間是無效的。

這是有效的：

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

或者這是有效的：

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

在一個側面說明：您正在使用的表格式表單。表格用於表格數據。在我的書中使用表格進行佈局是一個糟糕的主意。爲HTML元素使用適當的語義（表格=表格數據，li =列表，div =頁面分隔符等）。

來源

2010-11-22 21:39:22

爲什麼這個jQuery選擇器不起作用？

回答

相關問題