jQuery關於動態元素的提示

Question

我似乎無法正常工作。

我正在編寫指向DOM的幾個鏈接（通過json文件循環並附加到DOM），然后我需要那些元素來觸發懸停時的工具提示。

我在任何地方都沒有看到這種方法的一個很好的例子-cluetip網站顯示了一個簡短的示例，該示例尋找a然后調用cluetip。 我在想必須使用.live或.delegate方式來做到這一點：

$("body").delegate("a.toolTip", "mouseover", function (event) {

            $('a.toolTip').cluetip({
                showTitle: false,
                attribute: 'title',
                local: false
                });

            event.preventDefault();

        });

但這不會觸發第一次鼠標懸停，並且我得到一個“抱歉，無法加載內容”

有任何想法嗎？

謝謝

Answer 1

您需要重新觸發mouseover事件。

$("body").delegate("a.toolTip", "mouseenter", function (event) {
    $('a.toolTip').cluetip({
        showTitle: false,
        attribute: 'title',
        local: false
    }).trigger("mouseenter");

    event.preventDefault();
});

其他挑剔的事情：

event.preventDefault()應該排在最前面 ，並且您應該防止插件被多次應用。

$("body").delegate("a.toolTip:not(.hasTooltip)", "mouseenter", function (event) {

    $('a.toolTip').cluetip({
        showTitle: false,
        attribute: 'title',
        local: false
    }).addClass("hasTooltip").trigger("mouseenter");
    event.preventDefault();
});

編輯：mouseover應該已經是mouseenter了，event.preventDefault實際上應該是last，因此，如果它確實失敗了，則默認的工具提示仍將起作用。