Question

我有以下html：

<table id="TableNewUser" runat="server" width="50%" cellpadding="3" cellspacing="1"
border="0">
<tr>
    <th colspan="2">
        New User
    </th>
</tr>
<tr>
    <td width="50%" align="right">
        <asp:TextBox ID="TextBoxUsername" runat="server" Style="direction: rtl;" MaxLength="25"></asp:TextBox>
    </td>
    <td align="left" width="50%">
        UserName
    </td>
</tr>
<tr>
    <td align="right">
        <asp:TextBox ID="TextBoxPass" runat="server" MaxLength="25"></asp:TextBox>
    </td>
    <td align="left">
        Password :
    </td>
</tr>
<tr>
    <td colspan="2">
        <asp:Button ID="ButtonSubmit" runat="server" Text="Submit" OnClick="ButtonSubmitClick" />
    </td>
</tr>
</table>

每当文本框聚焦时，我想改变tr样式我使用了下面的CSS代码，但它不起作用。

input[type="text"]:focus tr
{
    background-color: #e7e7e7;
}

你能指导我吗？

Answer 1

正如Dissappointment先生所说，你必须使用JavaScript（或jquery）来实现你想要的目标。

我编写了一个非常简单的HTML页面来举例说明：

<html>
<head>
<script type="text/javascript">
function changeTrStyle()
{
document.getElementById("trId").style.background = "red";
}
</script>
</head>
<body>
<table>
    <tr id="trId">
        <td>
            <input type="text" onfocus="changeTrStyle()"/>
        </td>
    </tr>
</table>
</body>
</html>

如果您对文本框进行了对焦， tr 背景将变为红色。

注意：在Safari和Chrome上测试过。

每当“输入”聚焦时改变`tr`风格？

1 个答案: