更改“th”的背景颜色,更改为紧接着的下一个td

Change background color of "th" on change to the immediately next td

本文关键字:紧接着 td 下一个 颜色 th 背景 更改      更新时间:2023-09-26
我想

在更改旁边的"td"元素中的"input"elem 后更改"th"元素的颜色。

这是我使用的jQuery脚本。

$('#phoneNo').change(function () {
    $(this).closest("tr").find("th").css("background-color","yellow");
    });

网页代码

<tr>
    <th>PhoneNo</th>
    <td><input type="text" id="phoneNo"/></td>
    <th>EmailId</th>
    <td><input type="text" id="emailId"/></td>
</tr>

它的行为就像我所期望的那样 - 它更改行中所有"th"元素(代码中的PhoneNo和EmailId)的背景颜色。但我想要的是只更改一个"th"的颜色 - 在相应的"td"之前的颜色(只有PhoneNo)

$('#phoneNo').change(function () {
    $(this).parent().prev("th").css("background-color","yellow");
});

请注意,由于.prev()正在寻找以前的兄弟姐妹,因此您需要首先找到 td 元素

$('#phoneNo').change(function () {
    $(this).parent().prev('th').css("background-color","yellow");
});​

见小提琴 http://jsfiddle.net/zSjMh/1/