[英]Why this jquery selector does not work?
I have a task from a client to correct a page and I found that jQuery descendant selector does not behave as expected. 我有一个来自客户端的任务来更正页面,我发现jQuery后代选择器没有按预期运行。
Here is an excrept of the HTML: 这是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>
I tried to debug it with FireFox: 我尝试用FireFox调试它:
this worked: 这工作:
console.debug($("#mssysform8217 :input[name='email']").val());
test@gmail.com test@gmail.com
this did not worked: 这没效果:
console.debug($("#mssysform8217 #formfield-item-email :input[name='email']").val());
undefined 未定义
but: 但:
console.debug($("#mssysform8217 #formfield-item-email"));
[div#formfield-item-email.formfield-item] [DIV#formfield项-email.formfield项目]
The problem is that the submit script is generated by a third party app and it wants to use the 3 level descendant selector. 问题是提交脚本是由第三方应用程序生成的,它想要使用3级后代选择器。
The jQuery selector you are trying to use will not work because the HTML is invalid. 您尝试使用的jQuery选择器将无法工作,因为HTML无效。
<table style="width: 100%">
<div class="formfield-item" id="formfield-item-email">
<tr>
This is not valid HTML. 这不是有效的HTML。 It is not valid to place a div (or any element other than
<thead>
, <tfoot>
, <tbody>
, <tr>
) in the middle of a table outside of a cell. 将div(或
<thead>
, <tfoot>
, <tbody>
, <tr>
以外的任何元素)放置在单元<thead>
的表格中间是无效的。
This is valid: 这是有效的:
<div>
<table>
<tr><td></td></tr>
</table>
</div>
Or this is valid: 或者这是有效的:
<table>
<tr><td><div></div></td></tr>
</table>
On a side note: You are using the table to format your form. 旁注:您正在使用该表格式化表单。 Tables are meant for tabular data.
表格用于表格数据。 Using tables for layout is a bad idea in my book.
在我的书中使用表格进行布局是一个坏主意。 Use proper semantics for HTML elements (tables = tabular data, li=lists, div=page divisions, etc...).
对HTML元素使用适当的语义(表=表格数据,li =列表,div =页面划分等...)。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.