我正在尝试在嵌套列表上使用 jquery droppable,在悬停时对 li 的背景颜色进行更改。问题是它只适用于列表中的第一项。不过,警报仍在提醒列表项中的文本。任何想法为什么会发生这种情况?
$("#mailbox li").droppable({
greedy: true,
hoverClass: 'mailbox-hover',
drop: function(event, ui) {
alert($(this).text());
}
});
[编辑] 在某些测试中,警报正常工作,正在应用悬停类(根据 fireBug),但是当我将鼠标悬停在第一个元素上时,它只会改变文本颜色。
<ul id="mailbox" class="filetree">
<li>
<span class="folder">imap@gazler.com
</span>
<ul>
<li id="0-INBOX">
<span class="folder">
</span>
<a href="#" onclick="changeFolder('0', 'INBOX', 'INBOX');" name="INBOX">INBOX
</a>
<ul>
<li id="0-INBOX-Drafts">
<span class="file">
</span>
<a href="#" onclick="changeFolder('0', 'INBOX.Drafts', 'Drafts');" name="INBOX.Drafts">Drafts
</a>
<li id="0-INBOX-Sent">
<span class="file">
</span>
<a href="#" onclick="changeFolder('0', 'INBOX.Sent', 'Sent');" name="INBOX.Sent">Sent
</a>
<li id="0-INBOX-Trash">
<span class="folder">
</span>
<a href="#" onclick="changeFolder('0', 'INBOX.Trash', 'Trash');" name="INBOX.Trash">Trash
</a>
<ul>
<li id="0-INBOX-Trash-New">
<span class="file">
</span>
<a href="#" onclick="changeFolder('0', 'INBOX.Trash.New', 'New');" name="INBOX.Trash.New">New
</a>
</ul>
</ul>
</ul>
</li>
[ css is comments ] - 另外,可能相关,可能是 css 错误,它不会让我在悬停时设置 li 的背景颜色,只有字体颜色。
.mailbox-hover
{
background-color: #0000ff;
}
.mailbox-dropped
{
color: #ffff00;
}
[已解决] - 最后,即使所有列表项都附加了 id,它也不会让我发出警报 ($(this).id)。