javascript - 我无法让 live() 表现得像悬停()

Question

我在 jQuery 1.4 中的实时绑定(bind)方面遇到了一个非常大的问题。我想将悬停事件绑定(bind)到 div.message 元素并淡入控件。它们默认是隐藏的。使用 .hover() 时这很容易，但不会绑定(bind)通过 ajax 添加的新项目。我尝试过 .live() 但没有成功。每次光标移动到消息的各种内容上时，它都会触发 mouseover 和 mouseout 事件。正如您可以想象的那样，这会使控件闪烁。我希望当鼠标悬停在消息上时控件淡入。但我需要在加载新消息时将效果绑定(bind)到它们。我反对在加载消息时绑定(bind)悬停事件。我更喜欢像 live 这样的解决方案，但工作原理与悬停完全一样。

<div id="messages">
    <div class="message">
        <div class="controls">
            <a href="dosomthing">
                do somthing
            </a>
            <a href="dosomthing">
                do somthing
            </a>
        </div>
        <p>blah blah blah</p>
    </div>
    <div class="message">
        <div class="controls">
        </div>
        <p>blah blah blah</p>
    </div>
    <div class="message">
        <div class="controls">
            <a href="dosomthing">
                do somthing
            </a>
            <a href="dosomthing">
                do somthing
            </a>
        </div>
        <p>blah blah blah</p>
    </div>
</div>

Answer 1

要解决此问题，您可以使用 delegate在 1.4.2 版本中添加，如下所示:

$("#container").delegate("div", "hover", function(){
    // your code....
});

.delegate()

Description: Attach a handler to one or more events for all elements that match the selector, now or in the future, based on a specific set of root elements.