Question

我试图通过递归$ .ajax（）调用从服务器检索信息，但是想要在删除绑定它们的元素时关闭这些调用。

function check_for_update($element) {

    // this is where I need your help fellas:
    $does_this_element_currently_reside_in_the_dom = ????? ; 

    if ($does_this_element_currently_reside_in_the_dom) {
        $.ajax({ ... });
        setTimeout(function() { 
            check_for_update($element) 
        }, 1000);
    } 
}
$ele = $('<div id="element1"></div>');

// start recursion
check_for_update($ele);

从DOM中删除元素应该停止递归：

$ele.remove();

由于可以通过各种方式删除元素，因此为每个场景编写回调会很麻烦。（即：它可以被移除，其父级可以被移除，其父级的父级可以被删除....）。

谢谢！

Answer 1

检查元素是否存在于setTimeout内并清除定时器。见下文，

function check_for_update($element) {

    var timer; //added
    // this is where I need your help fellas:
    $does_this_element_currently_reside_in_the_dom = ????? ; 

    if ($does_this_element_currently_reside_in_the_dom) {
        $.ajax({ ... });
        //v-- Added timer var
        timer = setTimeout(function() { 
            if ($('#element1').length) clearTimeout(timer); //Added
            check_for_update($element) 
        }, 1000);
    } 
}
$ele = $('<div id="element1"></div>');

// start recursion
check_for_update($ele);

Answer 2

感谢您的帮助！你是一群男士！

这是我的解决方案，它位于递归函数中：

function check_for_update($element) {

    // check for the check_for_update_id attribute
    if ($element.attr('check_for_update_id') === undefined) {
        // set the attribute if it's currently undefined
        d = new Date();
        check_for_update_id = String(d.getTime()) + String(d.getMilliseconds());
        $element.attr('check_for_update_id', check_for_update_id);
        }
    // create $element_new using the check_for_update_id attribute
    $element_new = $(  '[check_for_update_id=' + 
                        $element.attr('check_for_update_id') +
                       ']');

    // if $element has been removed from the DOM,
    // $element_new will not have a 'check_for_update_id' attribute
    if ($element_new.attr('check_for_update_id') !== undefined) {
        $.ajax({ ... });
        setTimeout(function() { 
            check_for_update($element_new);
        }, 1000);
    } 
}

元素第一次传递给函数时，$ element中的属性'check_for_update_id'将是未定义的。如果它当前未定义，则设置'check_for_update_id'，并且所有后续的setTimeout（）调用check_for_update（）函数，$ element现在将具有与之关联的'check_for_update_id'值。为了避免碰撞，我将'check_for_update_id'设置为调用此函数时的秒+毫秒（这对我来说有点矫枉过正，但比抱歉更安全）。

然后使用'check_for_update_id'属性作为选择器在函数内创建$ element_new：

$element_new = $(  '[check_for_update_id=' + 
                    $element.attr('check_for_update_id' + 
                   ']');

如果在setTimeout（）迭代之间删除了$ element，则$ element_new将不会定义'check_for_update_id'属性，并且不会再次调用setTimeout（）。

jQuery：删除元素时清除递归setTimeout

2 个答案: