如何根据列值对一个表运行一些jQuery来更改填充？

Question

我有下面的代码，我需要这样做，所以填表在我的表的第二列取决于第一列中的数字。

<tr> 
    <td id="refKey_1" style="text-align:center;" class=" sorting_1">1.0.0</td> 
    <td id="Title_1"> 
     <input type="text" value="x" size="100" name="item.Title" id="item_Title_1"> 
    </td> 
</tr> 
<tr> 
    <td id="refKey_2" style="text-align:center;" class=" sorting_1">1.2.0</td> 
    <td id="Title_2"> 
     <input type="text" value="xx" size="100" name="item.Title" id="item_Title_2"> 
    </td> 
</tr> 
<tr> 
    <td id="refKey_3" style="text-align:center;" class=" sorting_1">1.3.4</td> 
    <td id="Title_3"> 
     <input type="text" value="xxx" size="100" name="item.Title" id="item_Title_3"> 
    </td> 
</tr> 

我需要的是将第二列具有如果第一列ID在0.0，0.0或非零结束0，10px的或根据20像素的左填充。

有没有办法可以用jQuery做到这一点？

Answer 1

我假设你的意思是单元格的文本，对吗？只是一些正则表达式匹配来做到这一点。

$('tr').each(function() { 
    var tds = $(this).find('td'), 
     text = tds.filter('[id^="refKey_"]').text(), 
     tdToPad = tds.filter('[id^="Title_"]'), 
     pad; 
    if (/0\.0$/.test(text)) 
     pad=0; 
    else if (/\.0$/.test(text)) 
     pad=10; 
    else 
     pad=20; 
    tdToPad.css('paddingLeft', pad); 
}); 

Fiddle

编辑：你也可以使用一个公共类，而不是这些ID选择，这将是一个更标准的做法。另外，您可以将表格ID添加到第一个选择器：$('#tableID tr')以防您的页面中有多个表格。

Answer 2

$('#tableThatICareAbout').find('tr > td').eq(1) 
.css('padding-left', 

$('#tableThatICareAbout').find('tr > td').eq(0)[0].id.split('_')[1] 

); 

我希望这个工作，但它是解决这一问题的任何核心的问题是一个可怕的，可怕的方式。