Question

我不是100％肯定如何提出这个问题。如果你理解，请编辑它。

我想检查一个sub-div鼠标悬停事件。但它不起作用。我目前的代码是：

$('#mc').hover(function() {
    if (selectedCoding !== 1)
        $(this).css({"color":"red"});
    else
        $(this).css({"color":"white"});
}, function() {
    if (selectedCoding !== 1)
        $(this).css({"color":"white"});
    else
        $(this).css({"color":"red"});
});

这是#mc所在的地方：

<div id="coding">
    <ul>
        <li id="mc">
            <img src="images/minecraft.png">
            <h3>Minecraft Plugins</h3>
            <p>Description text</p>
        </li>
    </ul>
</div>

这里的问题是它在jQuery函数中找不到#mc。

在我的index.php文件中，我有这个小代码：

$('#webbox').load('codinghelp.html');

以下所有内容都在“codinghelp.html”中：

    <div id="coding">
    <ul>
        <li id="mc">
            <img src="images/minecraft.png">
            <h3>Minecraft Plugins</h3>
            <p>Description text</p>
        </li>
    </ul>
</div>
<span style="color:green" id="request"> </span>

我无法从index.php文件中找到#mc，但我可以找到#request，因为此代码有效：

$('#request').text('Minecraft');

Answer 1

最好使用CSS来处理这个问题，然后您不必担心事件绑定和动态元素。当mc的值发生变化时，您只需要在selectedCoding上设置课程。

<强> Working Demo

<强>的jQuery

$('#mc').addClass((selectedCoding !== 1 ? 'selected' : 'selectedInverse'));

<强> CSS

.selected {
    color: white;
}
.selected:hover {
    color: red;
}

.selectedInverse {
    color: red;
}
.selectedInverse:hover {
    color: white;
}

检查sub-div鼠标悬停

1 个答案: