jQuery：删除当前元素之后的元素

我有一个关于删除当前元素之后的所有元素的问题

以下是场景：

我有一个位置树，我的用户需要遍历它才能获得特定的值。我有一个SELECT，它通过ajax加载顶级位置。为了缩小选择范围，数据具有更细粒度的值，因此我根据用户的选择添加了一个新的选择。当用户到达数据可用选项的末尾时，我停止添加SELECTs并获取最后一个选项的值，这就是我想要的

我编写这段代码的方式是从一个SELECT开始，该SELECT具有硬连接的顶级位置ID，然后有一个“onchange”事件处理程序，它进入我的数据库并获取该选择的子项，然后在当前TD中创建新的SELECT

这种情况一直持续到最后一个选择没有返回孩子为止。在这一点上，我可以得到这个最终位置的ID

这非常有效，直到用户决定更改某些内容，一个或两个用户选择“上游”

下面是一个示例，说明了从位置树中获取的用户可能拥有的内容（这些是代码中的选择）：

美国->俄亥俄->凯霍加->克利夫兰->第一区

如果“District 1”是此位置链中的最后一个可用项目，我可以使用$（“#locations select:last”）.val（）获取它。文德巴

如果用户决定“嗯，不，我要找的不是Cuyahoga，而是Stow”，并更改第三个选择选项，那么效果就不太好了。我需要做的是删除包含“Cuyahoga”的select之后的所有select，因为我现在必须为“Stow”获取更多数据。先前选择之后的任何选择都不再有效

正在操纵的select在onchange事件中传递自身，因此我拥有当前元素。我尝试了$（elem）.after（）.remove（），但这不起作用

关于如何删除当前选择之后的所有选择，有什么想法吗

谢谢

文档的结构如下所示：

<table border id="loctable">
  <tr><th>Location:</th><td><select id="loc0" onchange="return UpdateLocationSelect(this);">
    <option>choose..</option>
    <option value="3">USA</option>
    </select>
  </td>
  </tr>

地点：
选择。。
美国

[剪报]

function UpdateLocationSelect(elem) {
    // load sub locations for PPID given. IN this case, locations under USA. add options to elem
    // Also, erase any selects after this one, in case the user has "backed up" his selection

    $(elem).next().remove();  // Help needed here!! how to remove any SELECTs after this one??

    $.ajax({
        url: "api.php",
        dataType: "json",
        data: { cmd: "sublocs", "pid": elem.value },
        async: false,
        success: function( data, textStatus ) {
            // results
            if( $(data).length ) {
                $('#loctable td').append( "<select onchange='return UpdateLocationSelect(this);'><option>choose..</option></select>");
                $.each( data, function( key, val ){
                    $('#loctable select:last').append( '<option value="'+key+'">'+val+'</option>' );
                });
            }
            else
            {
                // we've hit the end of this location branch. Alert to check val is right
                alert( "LocID: " + $('#loctable select:last').val() );
            }
        },
      });
      return false;
    }

函数更新定位选择（elem）{
//加载给定PPID的子位置。在这种情况下，位置位于“美国”下。向元素添加选项
//此外，如果用户已“备份”其选择，请删除此选择之后的任何选择
$（elem）.next（）.remove（）；//此处需要帮助！！如何删除此选项之后的所有选项？？
$.ajax({
url:“api.php”，
数据类型：“json”，
数据：{cmd:“sublocs”，“pid”：elem.value}，
async:false，
成功：功能（数据、文本状态）{
//结果
如果（$（数据）.length）{
$（'#loctable td'）。追加（“选择…”）；
$。每个（数据、函数（键、值）{
$（'#loctable select:last'）。追加（''+val+''）；
});
}
其他的
{
//我们已到达此位置分支的末尾。请提醒检查val是否正确
警报（“LocID:+$（'#loctable select:last'）.val（））；
}
},
});
返回false；
}

如果需要指定选择器，可以使用相同的方法进行指定

$(elem).nextAll('select.some-class').remove();

---

要删除在当前选择之后发生的选择，只需使用：

var curSelect = $('select').index('select');
$('select').gt(curSelect).remove();

将选择器传递给

index（）

意味着它将查找文档中与该选择器匹配的所有元素，而不是从其同级元素中提供元素的索引

gt（）

查找初始选择器返回的索引大于

curSelect

变量传入的索引的所有元素，在这种情况下，将它们传递给

remove（）

方法

参考资料：

---

谢谢，我完全忘了nextAll（）。工作起来很有魅力。谢谢

var curSelect = $('select').index('select');
$('select').gt(curSelect).remove();