jquery - 无法确定在 div 内表内的 td 上使用什么选择器

标签 jquery html css html-table

我无法确定使用哪个选择器来访问 CSS 属性。这是我的代码:

我的jquery:

<script type="text/javascript">
    $(document).ready(function () {
        $('#columnDay1').css('cursor', 'pointer');
        $('#columnDay1').mouseover(function () {
            $('td.calendarHeader').css("background-color", "#a43802");
        });
        $('#columnDay1').mouseout(function () {
            $('td.calendarHeader').css("background-color", "#37322e");
        });
    });
</script>

我的 html:

<div class="contentColumnDay1">
<table cellpadding="0" cellspacing="0" id="columnDay1">
    <tr>
        <td class="calendarHeader">
            <p><span class="dayHeader">Day 1</span><br />August 15, 2011</p>
        </td>
    </tr>
    <asp:Label runat="server" id="labelDay1"></asp:Label>
</table>

我正在尝试访问 .calendarHeader CSS 属性 background-color。我试过 #columnDay1.calendarHeader 但它不起作用。我用头撞 table 。

有什么帮助吗?

最佳答案

代替

$('#columnDay1').mouseover(function () {
    $('td.calendarHeader').css("background-color", "#a43802");
});

尝试

$('#columnDay1').mouseover(function () {
    $('td.calendarHeader', this).css("background-color", "#a43802");
});

td.calendarHeader 将引用类“calendarHeader”的每个 td。您需要为其提供 this$(this) 的上下文,以指定您只想在您刚刚鼠标悬停的元素内找到 td.calendarHeader。或者,您可以执行 $(this).find('td.calendarHeader').css

关于jquery - 无法确定在 div 内表内的 td 上使用什么选择器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6273565/

相关文章:

css - 如何防止在 Windows Edge 上进行转换?

javascript - 如何将带有 HTML 实体的字符串转换为规范化形式?

jquery - 带有 jQ​​uery 的样式标签中的 CSS

php - AJAX 调用之间的持久 Mysql 连接?

javascript - 使用 jquery 隐藏和显示元素

jquery - 无法为 jquery 表单单击找到正确的选择器

javascript - 通过 Javascript 或 Jquery 在客户端格式化 JSON Datetime

javascript - 检测 Body Scroll 何时到达顶部 |元素底部

html - 为什么 HTML 中 "size"标记中的 "&lt;input&gt;"属性仅适用于 TEXT 而不适用于 NUMBER?

当屏幕缩小时,CSS 视频背景不会消失