这是用Coldfusion编写的,所以请忽略CF标记代码。这是一个jQuery问题。jQuery遍历DOM并循环遍历表没有id的
我有下面的表,根据项目,从1到200倍的任何地方循环。用户可以在systemname字段中输入系统名称,然后单击“CHECK”按钮。这会触发ajax调用来检查数据库,以查看输入的系统名称是否存在于数据库中。如果是这样,那么它将为用户填充其他字段。我可以填充第一个TR上的位置选择框,但是平台/模型和预计上线日期未填充,因为它们位于另一个TR上。我通过删除标签证实了这一点,所以我知道我的数据被返回是好的 - 我只需要把它放在正确的地方。
以口头方式遍历DOM会像这样读取: 一旦CHECK按钮被单击并返回数据,jQuery应该继续到父TABLE,然后向下两个TR然后进入TD定位平台,model ,和golive选择/输入字段。
我一直在学习遍历DOM,但是当事情是兄弟姐妹,祖先等。我样得到这里作为部分标记XML所概述的父/子关系船,我不理解(Javascript-Basics-Part-6 ),但我希望有人可以提供更好的教程或遍历DOM的例子。
下面是表代码
<cfloop query="rsRequestSystems">
<table cellpadding="3" class="tablesorter">
<tr>
<th class="form"><label>System Name</label></th>
<td><input name="systemname" type="text" class="systemname" value="#rsRequestSystems.systemname#" size="50" maxlength="50">
<div class="SystemNameStatus" style="color:##0000FF"></div></td>
<th class="form"><label>Location</label></th>
<td><select class="location" name="location">
<option></option>
<cfloop query="rsLocations">
<option value="#rsLocations.optionValue#" <cfif rsRequestSystems.location eq rsLocations.optionValue>selected</cfif> >#rsLocations.optionDesc#</option>
</cfloop>
</select></td>
<td rowspan="2" align="center">
<button type="button" class="fg-button ui-state-default ui-corner-all remove_SystemName" style="width:70px;">Remove</button>
<button type="button" class="fg-button ui-state-default ui-corner-all check_SystemName" style="width:70px;">Check</button></td>
</tr>
<tr>
<th class="form"><label>Platform/Model</label></th>
<td> <select class="platform" name="platform">
<option ></option>
<cfloop query="rsPlatform">
<option value="#rsPlatform.optionValue#" <cfif rsRequestSystems.platform eq rsPlatform.optionValue>selected</cfif>>#rsPlatform.optionValue# - #rsPlatform.optionDesc#</option>
</cfloop>
</select>
/
<select class="model" name="model">
<option selected></option>
<cfloop query="rsModels">
<option value="#rsModels.optionValue#" <cfif rsRequestSystems.model eq rsModels.optionValue>selected</cfif>>#rsModels.optionDesc#</option>
</cfloop></select>some text here</td>
<th class="form" nowrap><label>Estimated Go Live</label></th>
<td><input type="text" name="goLive" class="datepicker goLive" value="#dateformat(rsRequestSystems.golive,'mm/dd/yyyy')#" size="10"></td>
</tr>
</table>
</cfloop>
此代码工作对我的系统名称字段,但不是为平台领域。
thisClicked.closest("tr").find('.systemname').val(data.systemname); //works
thisClicked.closest("tr:odd").find('.platform').val(data.platform); //does NOT work
我试过以下,但无论是产生一个错误信息或者给我“未定义”
thisClicked.parent().closest("tr:odd").find('.platform').val(data.platform); //does NOT work
thisClicked.parent().child().("tr:odd").find('.platform').val(data.platform); //does NOT work
谢谢你的解释。你不会碰巧知道任何好的“遍历DOM例子”或教程,你会吗? – HPWD 2011-03-10 17:49:47
@dlackey不是我的头顶。我只会通读http://api.jquery.com/category/traversing/中的所有示例,然后搜索任何有趣/复杂的示例。 – 2011-03-10 20:08:47