jQuery 工具提示：remove() 的问题答案

【问题标题】：jQuery tooltip: Trouble with remove()jQuery 工具提示：remove() 的问题
【发布时间】：2012-12-14 04:27:44
【问题描述】：

我正在使用 jQuery tooltip 插件。

我有这样的 HTML：

<li class="term ui-droppable">
    <strong>Fall 2011</strong>
    <li class="course ui-draggable">Biological Statistics I<a class="remove-course-button" href="">[X]</a></li>
    <div class="term-meta-data">
         <p class="total-credits too-few-credits">Total credits: 3</p>
         <p class="median-GPA low-GPA">Median Historical GPA:  2.00</p>
    </div>
</li>

我想删除 .course 元素。因此，我将点击处理程序附加到 <a>:

function _addDeleteButton(course, term) {
    var delete_button = $('<a href="" class="remove-course-button" title="Remove this course">[X]</a>');
    course.append(delete_button);

    $(delete_button).click(function() {
        course.remove();
        return false;
    }).tooltip();
}

就附加点击处理程序而言，这一切都很好。但是在调用course.remove()时，Firebug在tooltip.js中报错：

Line 282
tsettings is null

if ((!IE || !$.fn.bgiframe) && tsettings.fade) {

我做错了什么？如果链接附有工具提示，我是否需要特别删除它？

更新：删除.tooltip() 解决问题。我想保留它，但这让我怀疑我在这里使用 .tooltip() 是不正确的。

【问题讨论】：

标签： javascript jquery dom jquery-tooltip

【解决方案1】：

我遇到了同样的问题，最终不得不延迟调用 .remove() 以防止出现错误。因此，以下内容可能对您有用：

$(delete_button).click(function() {
   setTimeout( function() { course.remove() } , 1);
   return false;
}).tooltip();

【讨论】：

【解决方案2】：

.tooltip() 插件有几个附加到元素的处理程序，即mouseover、mouseout 和click。如果您要删除元素，只需 .unbind() 所有这些事件，这样它们就不会运行，如下所示：

delete_button.click(function() {
    course.unbind().remove();
    return false;
}).tooltip();

另一个需要注意的变化是 delete_button 已经是一个 jQuery 对象，将它再次包装在 $() just clones it 中：)

发生错误是因为它试图通过.remove() 通过jQuery.data() 从元素中获取和使用它的设置数据，其中jQuery 从缓存中删除了它的数据。这种方法只会阻止所有这些工具提示处理程序再次运行，因此数据已经消失（应该如此）并不重要，因为现在没有任何东西会寻找它。

【讨论】：