Question

我很难在表中设置某个单元格的值。

以下是jsfiddle的链接，其中包含以下示例：Sample

我有表，它是按照以下方式创建的：

var r = [];
var j = -1; 
r[++j] =  '<table cellspacing="0" id="TableWeeklyFrame"><thead><tr><th><div>Day</div></th><th><div>Profile</div></th></tr></thead><tbody>'; 
for (var i=0; i<data.length; i++) {     
    r[++j] = '<tr class="WeeklyFrameTR">';
    r[++j] = '<td class="WeeklyFrameDay">';
    r[++j] = data[i];
    r[++j] = '</td><td><select class="SelectionWeeklyFrameProfile"></select>';
    r[++j] = '</td>';
    r[++j] = '</tr>';
}
r[++j] = '</tbody></table>';
$('#TableWeeklyFrame').html(r.join(''));

所以表有7行2列：

|Day|Profile|
|Monday|Value|
|Tuesday|Value|
|Wednesday|Value|
|Thursday|Value|
|Friday|Value|
|Saturday|Value|
|Sunday|Value|

值是包含多个值的选择。

现在问题..

我有一组值，e.q。（天=周一，值= OFF）。因为几天并不总是那个顺序（大多数都是，但这不是重点）我需要首先找到包含日期的行，然后将选择的值设置为我想要的任何值。

我可以通过

找到具有某一天的行

$('#TableWeeklyFrame tr.WeeklyFrameTR').find('td.WeeklyFrameDay:contains("Monday")');

最后问题是：如何设置该行的下一个/第二个单元格的值？

我试图不要遍历整个表格。到目前为止，我已经尝试了几件事，包括：

$('#TableWeeklyFrame tr.WeeklyFrameTR').find('td.WeeklyFrameDay:contains("Monday")').find('td select.SelectionWeeklyFrameProfile').val()
$('#TableWeeklyFrame tr.WeeklyFrameTR').find('td.WeeklyFrameDay:contains("Monday")').next('td').val()
$('#TableWeeklyFrame tr.WeeklyFrameTR').find('td.WeeklyFrameDay:contains("Monday")').find('select.SelectionWeeklyFrameProfile').val() 
$('#TableWeeklyFrame tr.WeeklyFrameTR').find('td.WeeklyFrameDay:contains("Monday")').next('select.SelectionWeeklyFrameProfile').val()

他们都返回undefined。我在这里遗漏了一些东西，我觉得这有点愚蠢和小......

此外，如果有更简单，更快捷的方法来获得类似的结果，请告诉我。

Answer 1

您需要了解jQuery的遍历函数是如何工作的。

children遍历儿童
find以递归方式遍历儿童
next和prev遍历一个兄弟

您无法同时遍历儿童和兄弟姐妹。

在你的情况下，你需要遍历兄弟姐妹：

mondayTD.next('td')

现在你到达了正确的td，你可以遍历孩子：

.find('select')

或（因为select是td）的孩子

.children('select')

你有选择。

Answer 2

您必须获取select值的选择器不正确：试试这个：

$('#TableWeeklyFrame tr.WeeklyFrameTR')
    .find('td.WeeklyFrameDay:contains("Monday")')
    .next('td').find('select.SelectionWeeklyFrameProfile').val()

Example fiddle

您可能还希望了解如何使用index()和eq()以及他们如何帮助您，因为它们比使用:contains('text')选择器要快得多。

Answer 3

您可以通过查看父级来更简单地解决此问题：

$('td.WeeklyFrameDay:contains("Monday")').parent().find('select')

总的来说，我认为这种围绕dom移动的解决方案很难维护，导致代码难看（比如我的或这里提供的任何解决方案）。

为什么不给每个人选择一个唯一的ID？它会使价值变得更加容易。

r[++j] = '</td><td><select id=profile-"'+data[i]+'"></select>';

然后可以用

更改

$("#profile-Monday")

如何在表中找到单元格并使用jQuery设置找到单元格的下一个单元格的值？

3 个答案: