将jQuery从1.8更新到1.11<a>标记未附加

Updating jQuery from 1.8 to 1.11 <a> tag not getting appended

本文关键字：gt jQuery 更新 lt      更新时间：2023-09-26

我正在尝试将此javascript代码从1.8更新为1.11，但遇到了问题。以下代码以前在1.8中工作，但现在只工作了一半（没有错误）。

我有以下功能：

function selectCountry(c_id){
    var obj = $('#country a[data-index=' + c_id + ']');
    if(obj.hasClass('cselect'))
        return;
    var clone = obj.clone();
    var div = $('<div class="keyword-box"></div>');
    var remove = $('<a href="javascript:void(0);" data-index="' + c_id + '" data-label="removeCountry_label" data-action="removeCountry" class="remove EXremove">&times;</a>');
    clone.after(remove).appendTo(div);
    div.prependTo('#selected_country');
    obj.hide().addClass('cselect');
    return false;
}

它过去所做的是创建这样一个div：

<div class="keyword-box">
    <a href="javascript:void(0);" class="country-link keyword" data-index="9" rel="Albania">Albania</a>
    <a href="javascript:void(0);" data-index="9" data-label="removeCountry_label" data-action="removeCountry" class="remove EXremove">×</a>
</div>

但现在它正在创建这样一个div：

<div class="keyword-box">
    <a href="javascript:void(0);" class="country-link keyword" data-index="9" rel="Albania">Albania</a>
</div>

我不知道为什么第二个a标记不再添加到div中。有人明白为什么会发生这种事吗？

1.9版中的jQuery发生了更改

在1.9之前，.fafter（）、.foref（）和.replaceWith（）将尝试如果集合未连接到文档，在这些情况下返回一个新的jQuery集合而不是原始集合。这创造了几个不一致和彻底的错误——该方法可能会也可能不会根据其参数返回一个新结果！截至1.9方法总是返回原始的未修改集，并尝试在没有父级的节点上使用.fafter（）、.foree（）或.replaceWith（）没有任何效果--也就是说，集或它包含的节点都不是已更改。

在您的情况下，您可以更改

clone.after(remove).appendTo(div);

至

clone.add(remove).appendTo(div);

或

div.append(clone, remove);

我认为如果你添加这样的链接，你的代码会更可读：

div.append(clone);
div.append(remove);
div.prependTo('#selected_country');

在jQuery 1.9中更改了.after() API。在你的案例中使用它现在没有效果。我认为您可能应该创建<div>，并显式地将两个<a>元素分别附加到其中

因此：

var div = $('<div class="keyword-box"></div>');
var remove = $('<a href="javascript:void(0);" data-index="' + c_id + '" data-label="removeCountry_label" data-action="removeCountry" class="remove EXremove">&times;</a>');
remove.appendTo(div);
clone.appendTo(div);
相关文章：