javascript - Parent() 函数不起作用

Question

最近 - 我在 SO 上发布了这个问题:Highlight rows in a html table with selected value

我有一个生成的 html 表和一个 JS 函数，它应该突出显示单元格“coversationid”具有相同值的所有行

这是一个 Fiddle 上的示例，效果很好:http://jsfiddle.net/sa4ED/

但是，如果我将相同的代码应用于我的代码，它会突然停止工作，我似乎无法找出原因......

HTML/JSP(简短版本):

<tbody>
    <c:forEach var="message" items="${messages}">
        <tr>
        <td class="time"><c:out value="${message.timestamp}" /></td>
        <td class="sender"><c:out value="${message.sender}" /></td>
        <td class="receiver"><c:out value="${message.receiver}" />
        </td>
        <td class="message"><c:out value="${message.shorterVersion()}" /></td>
        <td class="conversationid"><c:out value="${message.conversationid}" /></td>
        </tr>
    </c:forEach>
</tbody>

其他地方有链接触发突出显示功能:

<a href="#"onclick="highlight('${message.conversationid}');">highlight</a> 

JS:

function highlight(value) { 
    $(".conversationid").filter(function() {
        return $(this).html() == value;
    }).parent().css('background', "red");
}

当我点击这个函数时，它什么也不做。

我知道突出显示函数会被调用以及所有内容，如果我删除 parent()部分，它起作用了，所有具有我想要的conversationid值的单元格都会突出显示。但是，我希望整行突出显示。所以它确实可以在没有 parent() 的情况下工作但不与它一起。

为什么？显然 parent()调用 <td>应该返回父级 <tr>在这种情况下，对吧？怎么了？非常感谢您对调试的任何帮助...

CSS(简短版本):

table.pretty tbody tr.odd td {
    background: #FFFEFE;
}

table.pretty tbody td {
    text-align: left;
    background: #E1E9FF;
}

Answer 1

将 td 背景更改为透明。

function highlight(value) { 
    $(".conversationid").filter(function() {
        return $(this).html() == value;
    }).css('background','transparent').parent().css('background', "red");
}